Question

我希望在发生事件时通过引用键来加载我的数组元素我尝试了键的不同变量，但如果我将索引作为键，它将不会接受显示数组的所有元素。我是Reactjs的新手，并不熟悉所有的语法和概念，有人可以帮助我解决这个问题的逻辑。

我触发的事件是onClick或onChange。

`var Qstn =['A','B','C','D','E','F','G','H','I','J']; 

 <div>

  {Qstn.map(function(Q,index){
             return <span className="col-md-4 txt" key={index}>{Q}</span>

             })}
             </div>`

Answer 1

好的，我用一个例子

制作了一个codepen

http://codepen.io/lucaskatayama/pen/QGGwKR

它使用的是ES6类组件，但它很容易翻译。

您需要将初始状态设置为[]之类的空数组。在单击按钮上，它调用onClick（）方法，该方法使用this.setState({})来更改组件状态。

当React通知状态发生变化时，它会重新渲染组件。

class Hello extends React.Component {
  constructor(){
    super();
    //Initial State
    this.state = {
      Qstn : []
    }
  }

  onClick(){
    //Called on click button
    // Set state to whatever you want
    this.setState({Qstn : ['A','B','C','D','E','F','G','H','I','J']})
  }
  render(){
    let Qstn = this.state.Qstn; // load state and render
    return (
      <div>
        <button onClick={() => this.onClick()}>Click</button> 
        <div>
            {Qstn.map(function(Q,index){
               return <span className="col-md-4 txt" key={index}>{Q}</span>

            })}
        </div>
      </div>
    )
  }
}




ReactDOM.render(<Hello />,  document.getElementById('container'))

我无法一次检索一个数组元素，如果我在我的组件中调用它们，则一次检索所有元素

1 个答案: