gpt4 book ai didi

带有 redux 的 React-Native-Navigation V2 无法传递 props

转载 作者:行者123 更新时间:2023-12-04 04:06:40 24 4
gpt4 key购买 nike

我有一个简单的两屏应用程序,带有 redux 和 React-Native-Navigation V2。我尝试将列表中的项目作为 Prop 传递到另一个 View 。不幸的是,我收到一个错误:

TypeError: Cannot read property 'id' of undefined



该项目已传递但未作为第二个 View 中的 Prop 接收。在没有 Redux 的情况下工作时一切正常。我是否正确注册了 View ?

浏览注册:
export default (store) =>  {
Navigation.registerComponent('example.app.FirstScreen', reduxStoreWrapper(FirstScreen, store));
Navigation.registerComponent('example.app.SecondScreen', reduxStoreWrapper(SecondScreen, store));
}

function reduxStoreWrapper (MyComponent, store) {
return () => {
return class StoreWrapper extends React.Component {
render () {
return (
<Provider store={store}>
<MyComponent />
</Provider>
);
}
};
};
}

第一个 View :
class FirstScreen extends Component {
componentDidMount() {
this.props.listItems();
}

onItemPress = (item: Item) => {
Navigation.push(item._id, {
component: {
name: 'example.app.SecondScreen',
passProps: {
item: item
}
}
});
};

render() {
return (
<View>
<ItemsList items={this.props.items} onItemPress={this.onItemPress}/>
</View>
);
}
}

const mapStateToProps = state => {
let items = state.itemsReducer.items.map(item => ({ key: item.id, ...item }));
return {
items: items
};
};

const mapDispatchToProps = {
listItems
};

export default connect(mapStateToProps, mapDispatchToProps)(FirstScreen);

第二 View :
class SecondScreen extends Component {
static propTypes = {
item: PropTypes.object.isRequired,
};

componentDidMount() {
const { item } = this.props;
this.props.listSubitems(item.id);
}

render() {
const { subitems } = this.props;
return (
<View>
<SubitemsList subitems={subitems}/>
</View>
);
}
}

const mapStateToProps = state => {
let subitems = state.subitemsReducer.subitems.map(subitem => ({ key: subitem.id, ...subitem }));
return {
subitems: subitems
};
};

const mapDispatchToProps = {
listSubitems
};

export default connect(mapStateToProps, mapDispatchToProps)(SecondScreen);

最佳答案

View 应该这样注册:

export default (store, Provider) =>  {
Navigation.registerComponentWithRedux('example.app.FirstScreen', () => FirstScreen, Provider, store);
Navigation.registerComponentWithRedux('example.app.SecondScreen', () => SecondScreen, Provider, store);
}

关于带有 redux 的 React-Native-Navigation V2 无法传递 props,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52127061/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com