如何设置此嵌套对象的状态？

Question

嗨，我在按一个电子邮件输入上的“发送”按钮时无法设置状态。

我正在尝试按照React docs的建议避免突变。

我的状态属性是这样的：

state = {
    emailForm: {
      email: {
        elementType: 'email-invitation-input',
        elementConfig: {
          type: 'email',
          placeholder: 'Enter an email..',
        },
        value: '',
        valid: true,
        required: true
      }
    },
    requestStatus : false,
    validationMessage : null,
    formIsValid: false,
  } 

因此，我尝试了三种方法来通过状态为电子邮件输入设置空值，但是没有人起作用:(

第一次尝试：我使用ES6传播算子来更改它的值，但它不会更改输入值：

 this.setState({
   email: {
           ...this.state.emailForm.email,
           value: '',
           },
 });

 this.setState({
   email: Object.assign({}, this.state.emailForm.email, {
     value: '',
   }),
 });

另一种尝试使用immutability-helper程序包

import update from 'immutability-helper';
let newData = { email: {
   ...this.state.emailForm.email,
   value: '',
 }, };

 this.setState({
   email: update(this.state.newData, {
     value: {$set: newData},
   })
 }); 

第二次尝试：我使用了Ramda.js，但没有用。

setObjectByPath(fieldPath, value) {
  this.setState({
    emailForm: R.set(R.lensPath(fieldPath), value, this.state.emailForm)
  })
}

setObjectByPath(this.state.emailForm.email,'');

第三次尝试：

我用react-addons-update ：

import update from 'react-addons-update';

this.setState({
  email: update(this.state.newData, {
    value: {$set: newData},
  })
 });

所有尝试均不执行任何操作，否则将在下面创建一个空值的新电子邮件输入。

预先感谢

Answer 1

this.setState(prevState => ({
  emailForm: {
    email: {
      ...prevState.emailForm.email,
      value: ''
    }
  }
}));