2017-03-31 3 views
1

上にインデックスを渡して反応します。はJSがクリック機能上で要素をレンダリングし、私は基本的にそのリンクタグが値をクリック機能に持つ、ループを使用してコンポーネントを反応させるのレンダリングしようとしていますクリック機能

<p><a href="#" key={i} onClick={() => this.decreaseCount(i)} >delete</a></p> 

ここで、iはforループのインデックスです。問題は、this.decreaseCount(i)の中で値を取得する代わりに配列の長さが増えていることです。しかし、キー= {i}で正しいインデックスを取得しています

助けが必要です!動作するはず

答えて

2

は、この(別の方法)を使用しよう:

<p><a href="#" key={i} onClick={this.decreaseCount.bind(this,i)} >delete</a></p> 

チェックこの例で、あなたは道も動作します。

class App extends React.Component{ 
 
    
 
    a(i){ 
 
    console.log(i); 
 
    } 
 
    
 
    render(){ 
 
    return (
 
     <div> 
 
      { 
 
       [1,2,3].map(i => <p onClick={() => this.a(i)} > {i} </p>) 
 
      } 
 
     </div> 
 
    ) 
 
    } 
 
} 
 

 
ReactDOM.render(<App/>,document.getElementById('app'))
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script> 
 

 
<div id='app'/>

+0

うん、ワーキング!ご協力いただきありがとうございます! –

関連する問題