ReactJS setState只適用於setState嵌套

問題：當我使用this.setState和我在回調中輸出狀態時，它根本不會改變，但是當我將setstate嵌套在setstate中時，它將工作正確。ReactJS setState只適用於setState嵌套

舉例：這不起作用 -

this.setState({ 
    data: newData 
});

這並不工作 -

this.setState({ 
    data: newData 
},() => { 
    this.setState({ 
     data: newData 
    }); 
});

這是否有東西做的方式作出反應批次狀態更新？

這是實際的代碼，其中setstate不工作，除非我嵌套它（我試過評論所有在這個函數中，並使用setState設置coursePage爲null，但它不工作，除非它嵌套）：

cancelCPIndexChange(index){ 
    let temp = this.state.coursePages; 
    this.hideEditingCoursePage(index); 
    let canceledIndex = temp[index]; 
    temp = temp.slice(0, index).concat(temp.slice(index+1)); 
    temp = temp.slice(0, parseInt(canceledIndex.course_pageindex)-1).concat(canceledIndex).concat(temp.slice(parseInt(canceledIndex.course_pageindex)-1)); 
    this.setState({ 
    coursePages: temp 
    },() => {this.setState({ 
     coursePages: temp 
    }); 
    }); 
}

這是關於相同的水平cancelCPIndexChanges即能修改coursePages的狀態的另一功能：

showEditingCoursePage(index){ 
    let temp = this.state.coursePages; 
    temp[index].editingCoursePage = true; 
    this.setState({ 
    coursePages: temp 
    });  
}

這些功能是在course.js。這兩個函數都傳遞給CoursePages.js，然後傳遞給CoursePage.js。

來源

2015-12-23 Recur

不，'this.setState'總是有效的。你能在小提琴中重現你的問題嗎？ –

你如何調用set狀態？這可能是一個「這個」範圍問題。 –

我懷疑我可以在小提琴中複製這個問題。除了這個特殊的函數外，使用setState的其他函數在相同的作用域級別上工作得很好。我也將功能綁定到了正確的級別。 – Recur

據：https://facebook.github.io/react/docs/component-api.html

setState() does not immediately mutate this.state but creates a pending state transition. Accessing this.state after calling this method can potentially return the existing value.

（我已經在過去注意到這一點我自己）

我不是100％肯定，但我猜想，第二setState在你的回調函數會在創建第二個函數之前「沖洗」未決的狀態轉換。

我不清楚你想在哪裏消耗新的狀態值？它應該在render方法中，您可以確定它已被更新（因爲狀態轉換觸發了渲染）。如果你想在setState之後立即使用它，你仍然可以引用該值，所以可以直接使用它。

來源

2015-12-23 23:09:44

我在setState完成設置狀態後自動更新視圖的假設下工作。當我在第一個setState的回調中打印出狀態時，它是舊數據。 – Recur

狀態轉換觸發'render（）'並更新視圖。正如文檔所說，在調用'setState（）'後，這不一定會立即發生。正如你懷疑的那樣，它的確聽起來像批量生產。 –

@Recur總是假設'setState'是一個異步調用，你會很好。如果您想要根據您設置的值同步調用其他函數，然後調用它們並將該值作爲參數傳遞。如果你想異步調用其他方法，在你知道已經設置了狀態之後，從回調中調用它們（並且作爲個人偏好，我仍然會將該值作爲參數傳遞）。當你再次調用'render'時，狀態會被更新，但是如果你正在做其他事情，假設setState是異步的;它會爲你節省頭痛。 – Norguard

由於所述setState的行爲是異步的。有兩種方法可以訪問新更新的狀態值呈現

之前使用回叫功能的setState方法
使用componentDidUpdate方法。使用nextState參數可以訪問最新的狀態。但請確保你應該使用setState方法

來源

2017-11-06 10:17:43

ReactJS setState只適用於setState嵌套

回答

相關問題