[英]higher order component can't see props
我正在使用react-native和redux。 錯誤來自redux存儲中的組件。 之后,我收到:渲染未返回任何內容。 這通常意味着缺少return語句。 或者,不渲染任何內容,則返回null。
這有什么問題? 為什么看不到道具?
我的組件:
import React, { Component } from 'react'; import withHandleError from './withHandleError'; class SendScreen extends Component { render() { const { error } = this.props; return ( <div> Test </div> ) } }; const mapStateToProps = ({ppm}) => ({ error: ppm.error }) export default withHandleError(connect(mapStateToProps)(SendScreen));
和HoC:
import React, { Component } from 'react'; import { ErrorScreen } from '../../ErrorScreen'; import { View } from 'react-native'; export default Cmp => { return class extends Component { render() { const {error, ...rest } = this.props; console.log(error) //// undefined.... if (error) { return <ErrorScreen /> } return <Cmp { ...rest } /> } } }
當您要訪問彼此提供的道具時,稱為HOC的順序很重要。 重新排序您的連接和withHandleError HOC將起作用
import React, { Component } from 'react';
import withHandleError from './withHandleError';
class SendScreen extends Component {
render() {
const { error } = this.props;
return (
<div> Test </div>
)
}
};
const mapStateToProps = ({ppm}) => ({
error: ppm.error
})
export default connect(mapStateToProps)(withHandleError(SendScreen));
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.