React js this.props.variable在子組件中未定義組件

當我調用子組件（它是一個datePicker（無所謂））時，我設置了一個minDate變量。在孩子中，我得到this.props.minDate = undefined。React js this.props.variable在子組件中未定義組件

我錯過了什麼嗎？

這裏是我的代碼：

父組件

getInitialState() { 
    return { 
     minDate: '', 
     startDate: moment().subtract(30, 'days').format('YYYY-MM-DD'), 
     endDate: moment().format('YYYY-MM-DD') 
    }; 
}, 
componentWillMount() { 
    ... 
    this.setState({minDate: response}); 
    ... 
}, 
render() { 
    return (
     <DatePicker minDate={this.state.minDate} label="Start Date:"/> 
    ); 
}

輔元件

getDefaultProps() { 
    return { 
     label: 'Date:', 
     minDate: '', 
    }; 
}, 

componentDidMount() { 
    this.datePicker = $('#'+this.props.id); 
    if (this.datePicker) { 
     this.datePicker.datepicker({ 
      minDate: this.props.minDate 
     }); 
    } 
},

...

來源

2016-01-30 David Simon

當你調用'setState（）'時，我懷疑'response'在'componentWillMount（）'中是未定義的，也許你可以在那裏放一個console.log（response）來看看它是什麼。 –

這隻有在你傳遞了未定義的東西'minDate = {this.state.minDate}'時纔會發生。你記錄了這一點，並確保？ –

我得到的迴應，如果我console.log中的父render（）部分this.state.minDate，我得到的價值，因爲它應該是。 –

的問題是，你是jQuery的實例日期選取器時使用undefinedminDate值。

這裏是正在發生的minDate值：

父組件，因爲它的定義，因此在getInitialState方法minDate值設置爲空字符串。

父組件的minDate的值設置爲response變量的值（可能undefined，但我不能，因爲沒有其他信息什麼的response值是可以肯定的）。

兒童組件取值爲this.props.minDate當兒童安裝。此時this.props.minDate的值爲空字符串或undefined。

最後jQuery日期選取器在componentDidMount方法中給出值this.props.minDate。 jQuery日期選擇器僅實例化一次，因此如果this.props.minDate的值隨時間而改變，則不會由jQuery日期選擇器重新評估。

來源

2016-01-30 18:56:27 Enijar

當我讀到你的答案後，問題似乎比我想象的要小。我只需要在父render（）中檢查this.state.minDate是否爲空。 if（$ .isEmptyObject（this.state.minDate））{ return null; } 謝謝你的幫助。 –

子組件在沒什麼對象然而，父母卻擁有名爲minDate的名字。

如果您通過props對象在您的Child組件中訪問它，它將工作，除非您的Parent中您的componentWillMount中的響應當然未定義。

此外，如果您的minDate屬性應該是一個Date對象，我會默認返回相同類型的defaultProps。

getDefaultProps() { 
    return { 
     label: 'Date:', 
     minDate: '', 
    }; 
}, 

componentDidMount() { 
    this.datePicker = $('#'+this.props.id); 
    if (this.datePicker) { 
     this.datePicker.datepicker({ 
      minDate: this.props.minDate, 
     }); 
    } 
},

來源

2016-01-30 18:27:57

React js this.props.variable在子組件中未定義組件

回答

相關問題