打開輸入時如何設置默認值？

Question

我有一個輸入組件，我想在打開它時設置默認值（例如設置display property block ），然后可以控制輸入。 代碼示例

我嘗試使用componentWillReceiveProps或新的生命周期getDerivedStateFromProps 。 但是我發現一些文章說這是反模式。

有沒有更好的方法可以實現我的目標？

Answer 1

getDerivedStateFromProps是一個不錯的選擇，將以下代碼添加到您的InputForm中：

static getDerivedStateFromProps(nextProps, state){
    if(nextProps.show && !state.show) {
        return {
          show: true,
          value: 'default value'
        }
    }
    return null;
}

https://jsfiddle.net/dkhz32x9/