Question

有些新的反应并且无法将多个状态值传递给输入。

具体来说，从下拉菜单中说明。我可以通过将各种状态值链接在一起来在p标签中完成此操作。

此作品

   <p> 
    {this.state.one}_
    {this.state.two}_
    {this.state.three}_
    {this.state.four}_
    {this.state.five}
    </p>

这将返回

one_two_three_four_five

每当我尝试将这些相同的值传递到单个输入时，我都会收到错误。

这不起作用

<label>
  Title:
  <input 
value=
{this.state.one}_
{this.state.two}_
{this.state.three}_
{this.state.four}_
{this.state.five}
 type="text" /> 
</label>

如何将多个状态值传递到单个输入中？

Answer 1

带变量的模板文字：

<input 
        value={ `${this.state.one}_${this.state.two}` }
/>

Answer 2

您必须将单个表达式传递给value属性。改为：

<label>
  Title:
  <input value={`${this.state.one}_
    ${this.state.two}_
    ${this.state.three}_
    ${this.state.four}_
    ${this.state.five}`
 }
 type="text" /> 
</label>

注意：这是ES6字符串插值。 ES5替代方案是使用“+”

的常规字符串连接

使用React将多个状态值传递到输入中

2 个答案: