React篇(025)-我们为什么不能直接更新状态?

// Wrong
this.state.message = 'Hello world'

// Correct
this.setState({ message: 'Hello World' })

let x = [‘a’, ’b’, ’c’, ’d’, ’e’]
// 如果要从上面的数组中删除c并打印该数组，可以执行以下操作。
x.splice(2,1)
console.log(x) // prints [‘a’, ’b’, ’d’, ’e’]
// 但是splice直接修改了x，因此它使数组变了。
// 如下所述，可以使用slice和concat来实现这一目标，因为它们是不可变的操作，
let x = [‘a’, ’b’, ’c’, ’d’, ’e’]
let y = x.slice(0,2).concat(x.slice(3))
console.log(x) // prints original array [‘a’, ’b’, ’c’, ’d’, ’e’]
console.log(y) // prints [‘a’, ’b’, ’d’, ’e’]

let x = { ‘a’:’Hello’, ‘b’: ‘Hey’ }
// 现在，假设我们要将“ a”的值从“ Hello”更改为“ Hurray”。
// 可变方式：
// x.a ='Hurray'，如果x属于状态，这将直接在react中修改要避免的Object。
// 不变的方式：
let y = Object.assign({}, x } // creates a brand new object
// y.a ='Hurray'，现在y可用于更新react state，因为这是完全不变的。

// 使用spread operator可以实现与上述相同的功能。
let x = { ‘a’:’Hello’, ‘b’: ‘Hey’ }
let y = {…x,’a’:’Hurray’}
console.log(x) // prints { a: ‘Hello’, b: ‘Hey’ }
console.log(y)// prints { a: ‘Hurray’, b: ‘Hey’ }

let user = {
         profile:{
              address:{
              city: ‘London’
              }
         }
}

{
  …state,
    user:{
        …state.user,
        profile:{…state.user.profile,
        address:{…state.user.profile.address, city:’Newyork’}}
    }
}