2016-12-03 65 views
0

我是新使用Redux和我開發一個listViewfirstNamelastName顯示一些contactsreact 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); 
+0

你能告訴我們你的'connect'函數嗎? – martinarroyo

+0

當然是的,我甚至沒有注意到我忘了 – C00kieMonsta

+0

我認爲你的問題所在了'ParticipantsListItem'組件中,由於初始渲染工作。對不起再次提問,但是,您是否介意發佈該組件? – martinarroyo

回答

0

的解決辦法是使用cloneWithRows而不是cloneWithRowsAndSections

相關問題