關於空支柱的警告：爲什麼會發生？

我有分量，這需要渲染之前獲取服務器數據：關於空支柱的警告：爲什麼會發生？

class BooksManage extends Component { 
    componentWillMount() { 
    const { dispatch, fetchManagePage } = this.props 
    dispatch(fetchManagePage()) 
    } 
    render() { 
    const sections = this.props.books.map((section, index) => { 
     return (
     <div className='row' key={index}> 
      <BookSectionContainer index={index} /> 
     </div> 
    ) 
    }) 
    return (
     <div className='row'> 
     <div className='col-md-8'> 
      {sections} 
      <BookPaginationContainer paginationClass='books' /> 
     </div> 
     <div className='col-md-3'> 
      <div style={{position: 'fixed', width: 'inherit'}}> 
      <EmployeesListContainer /> 
      </div> 
     </div> 
     </div>) 
    } 
}

正如你所看到的，它使用BookPaginationContainer，其預計幾個狀態參數：

Warning: Failed prop type: The prop `currentPage` is marked as required in `Paginate`, but its value is `undefined`.

等等

問題：由於BookPaginationContainer是BooksManage的孩子，我期望通過componentWillMount()實現的是分派動作獲取需要的狀態參數。

實際發生的：

action REQUEST_MANAGE_PAGE @ 18:41:49.770 
Warning: Failed prop type: The prop `currentPage` is marked as required in `Paginate`, but its value is `undefined`. 
action RECEIVE_MANAGE_PAGE @ 19:01:40.327

所有頁面後呈現正確，但我關心的是如何好這一點。

來源

2017-06-19 Joe Half Face

「Paginate」組件在哪裏。 –

在獲得該數據之前，不要呈現需要數據的組件。

render() { 
    ... 
    if(!this.props.requireData) { 
    return <div>Loading</div>; 
    } 
    return (
    <div className='row'> 
    ...

來源

2017-06-19 16:08:34

我明白了，但我想我需要一些額外的回調來改變實際元素的「加載」嗎？ –

你沒有包括你的組件從何處/如何獲取數據，所以很難說。 React組件在獲得新狀態或道具時會自動重新渲染。因此，如果您的抓取調度將所需數據拖入狀態或道具中，它將自動使用正確的元素重新渲染。 –

當我使用'connect'時，它工作正常 –

關於空支柱的警告：爲什麼會發生？

回答

相關問題