直接設置狀態對象並調用setState

在我的組件中編輯現有的用戶數據。每個用戶數據集都有很多屬性。可以像下面的例子那樣設置一個對象的值。或者怎麼會是正確的？直接設置狀態對象並調用setState

getInitialState() { 
    return { 
     user: {age: 0, id: 0, weight: 0, size: 0, ...}, 
    }; 
    }, 

    componentWillReceiveProps: function (nextProps) { 
    this.setState({ 
     user: nextProps.user 
    }); 
    }, 

    editUserAge(age) { 
    this.state.user.age = age; 

    this.setState({ 
     user: this.state.user 
    }); 
    }

來源

2017-10-19 vuvu

正確的做法是避免直接突變狀態，這樣

editUserAge(age) { 
    let user = {...this.state.user}; 
    user.age = age; 

    this.setState({ user }); 
    }

來源

2017-10-19 10:41:52

。注意，對象擴展語法要求巴貝爾階段3預設，因爲它尚未標準化。您可以使用Object.assign代替，如果由於某種原因您不能添加預設。 –

您可以使用setState功能版本，當你要設置的值與從狀態的一些價值。這樣，如果狀態在您的方法中發生更改（因爲setState由於任何其他方法而可能隨時發生異步）您的當前更改不會受到影響。你也需要避免改變以前的狀態值。你可以使用Object.assign(..)。

例

editUserAge(age) { 
    this.setState((prevState) => { 
    let newUser = Object.assign({}, prevState.user, {age: age}); 
    return { user: newUser }; 
    }); 
}

來源

2017-10-19 11:21:36 bennygenel

直接設置狀態對象並調用setState

回答

相關問題