Question

从dataBase获取对象，之后我将其转换为数组以更改rect组件的状态，现在我想将数据更新到我在反应中创建的视图。

我所遵循的方法如下：

var PreviewContainer = React.createClass({
  getInitialState: function() {
    return {
      sourceImg: {
        src0: 'xyz',
        src1: 'xyz',
        src2: 'xyz',
        src3: 'xyz'
      },
      id: '',
      alter: "myalt"
    };
  },
  render: function() {
    Interfaces.previewContainer = this;
    var imgContainer = [];

    for (var i = 0; i < 4; i++) {
      imgContainer.push(React.createElement(PreviewImgContainer, {
        key: i,
        sourceImg: this.state.sourceImg['src' + i],
        alter: this.state.alter
      }));
    }
    return (
      React.createElement('div', {
          className: 'previewContainer'
        },
        imgContainer,
        React.createElement(ColorCardParent))
    );
  }
});

之后我必须使用静态方法

按照以下方式在容器中设置这些imaga

Interfaces.previewContainer.setState({sourceImg: {
    src0: templatearray[0].image_path.slice(1),
    src1: templatearray[1].image_path.slice(1),
    src2: templatearray[2].image_path.slice(1),
    src3: templatearray[3].image_path.slice(1)
  }
});

有没有办法做到这一点，我可以动态地做到这一点。

Answer 1

不太明确您要实现的目标以及问题所在，但您可以按如下方式填写sourceImg对象：

var sourceImg = {};
for (var i=0; i<templatearray.length; i++) {
  var srcKey = "src" + i.toString();
  sourceImg[srcKey] = templatearray[i].image_path.slice(1);   // fill object dynamically
}
Interfaces.previewContainer.setState({ sourceImg : sourceImg });

BTW：动态填充对象与反应无关。

我们可以动态添加状态名称

1 个答案: