React-Native with Redux:API 对象出现在我的 console.log 中,但不在我的视图中
Posted
技术标签:
【中文标题】React-Native with Redux:API 对象出现在我的 console.log 中,但不在我的视图中【英文标题】:React-Native with Redux: API objects appear in my console.log but not my view 【发布时间】:2016-06-25 05:41:27 【问题描述】:我正在使用react
、react-native
、react-native-router-flux
、react-redux
和redux
构建一个简单的体育应用程序,并试图将一个热门新闻对象的api
拉到我的view
中。我需要的对象显示在我的 console log
上,但无法让它显示在我的 view
上。
我得到的错误是:
无法读取未定义的属性“cloneWithRowsAndSections”
TypeError:无法读取属性“cloneWithRowsAndSections” 不明确的 在 NewsList.componentWillMount
我有什么遗漏的吗?
新闻列表:
export default class NewsList extends Component
constructor(props)
super(props);
const ds = new ListView.DataSource(
rowHasChanged: (row1, row2) => row1 != row2,
sectionHeaderHasChanged: (s1, s2) => s1 !== s2
);
this.state =
dataSource: ds.cloneWithRowsAndSections(props.ListData)
componentWillReceiveProps(nextProps)
const dataSource = this.state.dataSource.cloneWithRowsAndSections(nextProps.ListData);
this.setState(dataSource);
componentWillMount()
// console.log("whats This: ",this.props.ListData);
let data = this.props.ListData;
this.setState(
dataSource: this.ds.cloneWithRowsAndSections(data)
);
News_View:
render()
console.log('TopNews', this.state.TopNews);
if(this.state.TopNews.length == 0)
return(
<View style=styles.container>
<View style=styles.LiveStyle>
<Live style=styles.LiveStyle />
</View>
<View style=styles.container>
<Text style=[styles.NotFollowTeamMsg, styles.centerTeamMsg]>
Your not connected to the api
</Text>
</View>
</View>
)
else
return (
<View style=styles.container>
<NewsList
ListData=this.state.TopNews
/>
</View>
)
在构造函数中,我尝试将const ds = ...
更改为this.ds = ...
,但这只会导致错误:
ds 未定义 ReferenceError: ds 未定义
我尝试取出构造函数:
const ds = new ListView.DataSource(
rowHasChanged: (row1, row2) => row1 != row2,
sectionHeaderHasChanged: (s1, s2) => s1 !== s2
);
然后将其定位在 NewsList 类之外,我 setState
,像这样:
this.setState(
dataSource: ds.cloneWithRowsAndSections(data)
);
但这只会导致错误:
无法读取未定义类型错误的属性“绑定”:无法读取 未定义的属性“绑定”
【问题讨论】:
【参考方案1】:2 个选项:
1.在您的构造函数中将const ds = ...
设为this.ds = ...
2.把这个从constructor
函数中去掉:
const ds = new ListView.DataSource(
rowHasChanged: (row1, row2) => row1 != row2,
sectionHeaderHasChanged: (s1, s2) => s1 !== s2
);
并将其定位在NewsList
类之外。
现在,当你 setState
时,这样做:
this.setState(
dataSource: ds.cloneWithRowsAndSections(data)
);
【讨论】:
我已经尝试了这两个选项@gran33。出来的错误是:$ds is not defined ReferenceError: ds is not defined $ @Checkk 我也收到了你的错误,我的建议对我有用。您的班级不知道您的ds
变量,因为您没有将其添加到 this.ds = ...
以上是关于React-Native with Redux:API 对象出现在我的 console.log 中,但不在我的视图中的主要内容,如果未能解决你的问题,请参考以下文章
[Redux] Generating Containers with connect() from React Redux (AddTodo)
React-native + Redux(Combine Reducers):创建状态结构