第一种情况确实是语法错误。

因为我看不到组件的其余部分，所以很难理解为什么要在这里的状态中嵌套对象。在组件状态下嵌套对象不是一个好主意。尝试将初始状态设置为:

this.state = {
  name: 'jasper',
  age: 28
}

这样，如果你想要更新名称，你可以调用:

this.setState({
  name: 'Sean'
});

这能达到你的目标吗?

对于更大、更复杂的数据存储，我会使用Redux之类的东西。但这要高级得多。

关于组件状态的一般规则是只使用它来管理组件的UI状态(例如，活动，计时器等)。

看看这些参考资料:

https://facebook.github.io/react/docs/react-component.html#state https://facebook.github.io/react/docs/state-and-lifecycle.html

这是另一个使用immer immutabe实用程序的解决方案，非常适合于深度嵌套的对象，并且您不应该关心突变

this.setState(
    produce(draft => {
       draft.jasper.name = 'someothername'
    })
)

同样，按照Alberto Piras解决方案，如果你不想复制所有的“state”对象:

handleChange(el) {
    let inputName = el.target.name;
    let inputValue = el.target.value;

    let jasperCopy = Object.assign({}, this.state.jasper);
    jasperCopy[inputName].name = inputValue;

    this.setState({jasper: jasperCopy});
  }

在功能组件中使用钩子:

const [state, setState] = useState({jasper: { name: 'jasper', age: 28 }})
const nameChangeHandler = () => {
      setState(prevState => ({
            ...prevState,
            prevState.jasper.name = "Anurag",
            prevState.jasper.age = 28
      })
    )
}

在这些情况下，建议使用基于回调的方法来更新状态，因为使用这种方法可以确保之前的状态被完全更新，并且我们正在基于之前更新的状态进行更新。

另一种选择:用Jasper对象定义变量，然后调用一个变量。

扩展操作符:ES6

this.state = {  jasper: { name: 'jasper', age: 28 } } 

let foo = "something that needs to be saved into state" 

this.setState(prevState => ({
    jasper: {
        ...jasper.entity,
        foo
    }
})

试试这个，应该没问题

this.setState(Object.assign(this.state.jasper,{name:'someOtherName'}));