查找在React中单击的元素的值

时间:2018-04-16 17:11:33

标签: javascript reactjs

我正在使用Material Ui作为我的元素,我有一个按钮,当我点击时我需要知道它的值,以便我可以将它传递到后端以删除它..

我的JSX代码

for (let i = 0; i < this.state.emails.length; i++) {
    emails.push(
       <div key={i}>
          <TextField style={textField}
              autoFocus
              floatingLabelText="EMAIL"
              type="email"
              spellCheck={false}
              autoCorrect={"off"}
              value={this.state.emails[i]}
              onChange={(e) => this.setState({primaryEmail: e.target.value})}
              />
              <FlatButton
                 primary
                 label="REMOVE EMAIL"
                 className="userProfile-buttons"
                 value={this.state.emails[i]}
                 onClick={this.removeEmailHandler}
               />
         </div>
       )
     }

我的js代码

removeEmailHandler = (e) => {
    console.log(e.target.value)
}

2 个答案:

答案 0 :(得分:0)

您可以将您更改为

removeEmailHandler = (value) => {
    console.log(value)
}

所以你可以传入onClick

中的值

和onClick = {(value)=&gt; this.removeEmailHandler(value)}

答案 1 :(得分:0)

您确实不需要调用removeEmailHandler()方法的按钮的值。鉴于已在TextField组件道具中设置了更改,您需要处于该状态。

因此removeEmailHandler()方法基本上应该使用状态到后端的API调用。

removeEmailHandler = (e) => {
    // make API call with `this.state.primaryEmail`
}