getValue()表示SelectField

Question

我只想做的就是获取公司的名称并将其保存到数据库中

我试着处理文本，并试图使用下面的代码来获取

sport: this.refs.company.getValue(),和它工作得很完美。

然后我决定为公司使用材料UI中的SelectField

而不是获取数据。

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

submitResume(event) {
    event.preventDefault();
    console.log(this.state.company.getValue({value}));

CreatePost.insert({
        company: this.refs.company.getValue(),

        employee: this.refs.employee.getValue(),

    });
    console.log("Employee Profile Submitted!");
}


handleNameChange = (event, index, value) => this.setState({value});

    <form onSubmit={this.submitResume.bind(this)}>

          <SelectField
                    floatingLabelText="Company Name"
                    className="validate"
                    ref="company"
                    id="company"
                    floatingLabelStyle={{fontSize:20}}
                    fullWidth={true}
                    value={this.state.value}
                    onChange={this.handleNameChange}
                  >
                    <MenuItem value={1} primaryText="Google" />
                    <MenuItem value={2} primaryText="Facebook" />
                    <MenuItem value={3} primaryText="Amazon" />
                    <MenuItem value={4} primaryText="Nest" />
                    <MenuItem value={5} primaryText="Microsoft" />
            </SelectField>

            <TextField
                className="validate"
                type="text"
                ref="employee"
                id="employee"
                hintText="Enter Full Name"
                floatingLabelStyle={{fontSize:20}}
                floatingLabelText="Employee Name"
                multiLine={true}
                rows={1}
                fullWidth={true}
            />

它对TextField很好，但对SelectField却不起作用。

Answer 1

现在看到这个更新的值，您将在参数value、index或event中获得值。

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

submitResume(event) {
    event.preventDefault();
    console.log(this.state.company.getValue({value}));

CreatePost.insert({
        company: this.refs.company.getValue(),

        employee: this.refs.employee.getValue(),

    });
    console.log("Employee Profile Submitted!");
}


handleNameChange(event, index, value) {
  console.log(event);
  console.log(index);
  console.log(value);
  this.setState({value});
}

    <form onSubmit={this.submitResume.bind(this)}>

          <SelectField
                    floatingLabelText="Company Name"
                    className="validate"
                    ref="company"
                    id="company"
                    floatingLabelStyle={{fontSize:20}}
                    fullWidth={true}
                    value={this.state.value}
                    onChange={this.handleNameChange}
                  >
                    <MenuItem value={"Google"} primaryText="Google" />
                    <MenuItem value={"Facebook"} primaryText="Facebook" />
                    <MenuItem value={"Amazon"} primaryText="Amazon" />
                    <MenuItem value={"Nest"} primaryText="Nest" />
                    <MenuItem value={"Microsoft"} primaryText="Microsoft" />
            </SelectField>

            <TextField
                className="validate"
                type="text"
                ref="employee"
                id="employee"
                hintText="Enter Full Name"
                floatingLabelStyle={{fontSize:20}}
                floatingLabelText="Employee Name"
                multiLine={true}
                rows={1}
                fullWidth={true}
            />

Answer 2

我所需要做的就是传递文本值而不是数字。

<MenuItem value={"Google"}    primaryText="Google"    />
<MenuItem value={"Facebook"}  primaryText="Facebook"  />
<MenuItem value={"Amazon"}    primaryText="Amazon"    />
<MenuItem value={"Nest"}      primaryText="Nest"      />
<MenuItem value={"Microsoft"} primaryText="Microsoft" />