Question

我是新反应者。使用map和变量时遇到问题，您能帮我吗？我不知道如何在value = {name.value}

之类的选项中输入变量

const info = [
  { key: "닉네임", value: "name" },
  { key: "지역", value: "area" },
  { key: "생일", value: "birthday" },
  { key: "키", value: "tall" },
  { key: "몸매", value: "body" },
  { key: "직업", value: "job" },
  { key: "회사", value: "company" },
  { key: "학교", value: "school" },
  { key: "학력", value: "background" },
  { key: "종교", value: "religion" },
  { key: "흡연", value: "smoking" },
  { key: "카카오 아이디", value: "kakaoid" }
];

<Grid container spacing={3}>
            {info.map((info, index) => (
              <Grid item xs={12} sm={6} key={index}>
                <TextField
                  required
                  id={index}
                  name={info.value}
                  label={info.key}
                  value={}
                  onChange={}
                  fullWidth
                />
              </Grid>
            ))}
          </Grid>

我想那样做

<Grid item xs={12} sm={6} key={1}>
                <TextField
                  required
                  id={1}
                  name={"name"}
                  label={"닉네임"}
                  value={name.value}
                  onChange={name.onChange}
                  fullWidth
                />
              </Grid>

Answer 1

如果要为每个文本字段设置值。

为每个文本字段定义一个状态变量（使用每个文本字段的名称）并绑定一个on-change事件。
在on-change中绑定一个this并获取名称和值，基于on-change将值设置为每个文本字段的名称状态
现在将状态传递给每个文本字段。

您应该意识到在反应，变化事件中道具的状态。

例如

constructor(props){
    super(props);
    this.state = {
        value:''
    }
}

inputchange = (event) =>{
    this.setState({
        value:event.target.value
    })
}

render(){
    return (
        <div className="todolist">
            <input type="text" value={this.state.value} onChange={this.inputchange}/>
            <input type="button" value="Submit" onClick={this.props.handleclick.bind(this,this.state.value)}/>
        </div>
    );
}

}

在.map函数中使用变量react

1 个答案: