react-pixi Stage options.backgroundColor 不随状态改变

react-pixi Stage options.backgroundColor don't change with state

状态变化会影响其他 React-Pixi Stage 道具,例如高度或宽度。但是,当我尝试更改 Stack options.backgroundColor 时,backgroundColor 不会随状态更改而更改。

这是我的代码:

const edit = () => {
  const StageElement = {
    id: "ion-1212-2if",
    __typename: "CanvasStage",
    backgroundColor: "#CB6CE6",
    width: 500,
    height: 500,
  } as StageElementType;

  const [state, setState] = useState({
    stage: StageElement
  });
  const { stage } = state;


  // OnClick Canvas Elements
  const onClickCanvas = () => {

    setState({ ...state, stage: {...state, height: 400, width: 400, backgroundColor: "#38B6FF"}});
  };

  return (
    <Layout metaTags={metaTags}>
       <Box m="auto">
              <Stage
                width={stage.width}
                height={stage.height}
                raf={false}
                renderOnComponentChange={true}
                options={{
                  backgroundColor: getHexColorNumber(stage.backgroundColor),
                }}
                onClick={onClickCanvas}
              >
                <Graphics
                  draw={(g) => {
                    g.lineStyle(0);
                    g.beginFill(getHexColorNumber(stage.backgroundColor), 1);
                    g.drawCircle(300, 90, 60);
                    g.endFill();
                  }}
                />
              </Stage>
            </Box>
    </Layout>
  );
};

我在 github 个问题中得到了答案:github。com/inlet/react-pixi/issues/325#issuecomment-1047944615