我有一个 SearchPage 组件,它执行查询,然后在 ListView 中显示结果。然后,用户通过点击它们来选择他们想要的结果。这会将它们保存到 SearchResults 组件中的一个数组中。
如下面的代码所示,返回结果时会调用“displayWords”方法。它在堆栈上推送一个新 View SearchResults,将右侧按钮设置为“保存”,并附加一个要调用的函数来保存数据。
类 SearchPage 扩展组件 {
显示字(字){
this.props.navigator.push({
标题:'结果',
组件:搜索结果,
rightButtonTitle: '保存',
onRightButtonPress: () => {this.props.navigator.pop();
this.props.save()},
passProps: {listings: words}
});
this.setState({ isLoading: false , message: '' });
}
那么问题来了,如何从 SearchResults 组件中的数组中获取项目到回调中?还是到 SearchPage?还是我应该遵循另一种模式?
Best Answer-推荐答案 strong>
有趣的问题!
从哲学上讲,整个导航器和导航堆栈概念打破了 React-y 数据流。因为如果您可以将 SearchResults 组件简单地呈现为 SearchPage 的子组件,那么您只需使选定的搜索结果成为 SearchPage 的一部分状态并将它们作为 Prop 传递给 SearchPage 。每当切换搜索结果时,SearchPage 也会收到一个回调来通知 SearchResults 。
唉,导航器就是这样,你将不得不复制状态。
displayWords(words) {
this.props.navigator.push({
title: 'Results',
component: SearchResults,
rightButtonTitle: 'Save',
onRightButtonPress: () => {this.props.navigator.pop();
this.props.save()},
passProps: {listings: words, onWordToggle: this.onWordToggle}
});
this.setState({ isLoading: false , message: '' });
}
onWordToggle(word) {
// add or remove 'word' from e.g. this._selectedWords; no need for
// this.state because re-rendering not required
}
而 SearchResults 将在其 this.state 中维护所选单词的列表,并在单词出现时简单地通知 this.props.onWordToggle 添加或删除。
关于ios - 从 ListView 中保存数据的正确方法是什么?,我们在Stack Overflow上找到一个类似的问题:
https://stackoverflow.com/questions/30539877/
|