title: Can we add state name dynamically in react
body: <p>Getting the object from the dataBase and after that i am converting it to array to change the state of the rect component and now i want to update the data to my view that i have created in react.</p>
  
  <p>the method i am following is as under:
  </p>
  
  <pre><code>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 &lt; 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))
      );
    }
  });
  </code></pre>
  
  
  
  <p>and after that i have to set these imagaes in the container as follows way using static methods</p>
  
  <pre class="lang-js prettyprint-override"><code>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)
    }
  });
  </code></pre>
  
  
  
  <p>Is there a way to do this so that i can just do this dynamically.</p>