0
我是新使用Redux
和我开发一个listView
与firstName
和lastName
显示一些contacts
react native
来。当我连续按下时,该行应该改变其风格。阵营原住民 - 终极版 - 错误:未定义不是对象 - _renderRow的ListView
渲染的初始化情况很好,但是当我按排,我得到这个错误:
undefined is not an object (evaluating 'this.props.contact.firstName')
我相信,我传递给datasource
的对象是空的,但我真的不知道如何解决它。我试图在加载datasource
时将状态添加到true
,但它不起作用。
这是我的代码:
class ParticipantsListComponent extends Component<StateProps, { dataSource: ListViewDataSource }> {
constructor(props: StateProps) {
super(props);
let ds = new ListView.DataSource({ rowHasChanged: (r1, r2) => r1 != r2 });
this.state = {
dataSource: ds.cloneWithRows(this.props.participants)
};
}
componentWillReceiveProps(nextProps: StateProps) {
if (nextProps.participants !== this.props.participants) {
this.setState({
dataSource: this.state.dataSource.cloneWithRowsAndSections(nextProps.participants)
});
}
}
_renderRow = (entry: { contact: Contact, selected: boolean }, section: number, row: number) => {
return (
<ParticipantsListItem
contact={entry.contact}
selected={entry.selected} />
);
}
render() {
return (
<View style={styles.viewStyles}>
<TextInput style={styles.textInputStyles} />
<ListView
dataSource={this.state.dataSource}
renderRow={this._renderRow.bind(this)}
</View>
);
}
}
export const ParticipantsList: ComponentClass<void> = connect(
(state: StoreState, ownProps: void): StateProps => ({
participants: state.contacts.contacts.map(contact =>
({
contact,
selected: state.newTopic.participants.contains(contact.id)
})).toArray()
}),
dispatch => ({})
)(ParticipantsListComponent) as ComponentClass<any>;
基本上我需要找到一种方法来确保我传递给dataSource
的数据不是不确定的。如果有人知道解决方案,我会很高兴听到它。
你会发现在ParticipantListItemComponent
正确的代码如下:
class ParticipantsListItemComponent extends Component<OwnProps & DipatchProps, void> {
render() {
return (
<TouchableOpacity onPress={() => this.props.onPress(this.props.contact.id)} style={styles.container} >
<Text style={styles.name}>{!this.props.selected ? this.props.contact.firstName : ''} {this.props.contact.lastName}</Text>
<View style={{ flex: 1 }} />
</TouchableOpacity>
);
}
}
export const ParticipantsListItem: ComponentClass<OwnProps> = connect(
(state: void, ownProps: void): {} => ({}),
dispatch => ({
onPress: (id: string) => dispatch(toggleParticipant(id))
})
)(ParticipantsListItemComponent);
你能告诉我们你的'connect'函数吗? – martinarroyo
当然是的,我甚至没有注意到我忘了 – C00kieMonsta
我认为你的问题所在了'ParticipantsListItem'组件中,由于初始渲染工作。对不起再次提问,但是,您是否介意发布该组件? – martinarroyo