Итак, я сталкиваюсь с печально известным предупреждением React Router v4:
Warning: You should not use <Route component> and <Route children> in the same route; <Route children> will be ignored
Это происходит после переноса моего компонента, который сам отображает <Route />
внутри моего HOC, который предоставляет мой контекст React.
Все это выглядит примерно так:
App.js
:
<myContextProvider>
<Router>
<Switch>
<myLayout path="/foo" Component={someComponent}>
...
</Switch>
</Router>
</myContextProvider>
мой stores.js
файл включает в себя следующее:
export const withMainStore = (Component) => {
return (props) => {
return (
<MainConsumer>
{store => (
<Component {...store} {...props} />
)}
</MainConsumer>
)
}
}
myLayout.js
:
class myLayout extends React.Component {
const { Component, ...rest } = this.props;
// ...
render() {
return (
<Route {...rest} render={(props) => (
<Component {...rest} {...props} />
)}/>
)
}
}
export default withMainStore(myLayout)
Я надеюсь, что вся моя ситуация здесь несколько ясна.Может кто-нибудь объяснить мне, почему появляется предупреждение? Ни в коем случае во всем моем приложении у меня есть что-то вроде: <Route>...</Route>
- я всегда использую <Route {...rest} render={(props) => ( ... )} />
!
Так что я понятия не имел, почему это происходит.Мне нужно что-то сделать с моим withMainStore
HOC, потому что когда я его удаляю, ошибка исчезает.но все же я не понимаю, почему это вызывает ошибку.