Question

我希望为在数组中动态添加的每个项目生成一个实体。

有可能这样做吗？我如何将每个项目的值分配给每个实体？

this.state = {
    items: []
}

然后在渲染中：

    <Scene>
      {this.state.items.map((item, key) => {
        return (
            <Entity />
         )
        }
       )}
     </Scene>

Answer 1

您可以在组件状态下映射items并将item字符串赋予text组件的Entity属性。

示例

class VRScene extends React.Component {
  state = {
    items: ["lemon", "orange"]
  };

  componentDidMount() {
    setInterval(() => {
      this.setState(prevState => {
        return { items: [...prevState.items, Math.random()] };
      });
    }, 2000);
  }

  render() {
    return (
      <Scene>
        {this.state.items.map((item, index) => (
          <Entity
            key={item}
            text={{ value: item, align: "center" }}
            position={{ x: 0, y: 2 - index * 0.1, z: -1 }}
          />
        ))}
      </Scene>
    );
  }
}

A帧反应：.map（）时如何传递值？

1 个答案: