Question

抱歉，首先是因为我对此很陌生，这似乎是一个非常简单的问题。我有一个我在Main组件中使用的firebase数据库来显示数据列表。另外，我在下面创建了一个新组件，在数据中只显示一个随机项：WordOfTheDay，如下所示：

class WordOfTheDay extends Component{

  render(){

    return(
      <Card
        title='WORD OF THE DAY'
      >
              <ListView
              dataSource={this.state.dataSource}
              renderRow={this._renderWordOfTheDay.bind(this)}
              enableEmptySections={true}
              />

      </Card>

      );

  }


 _renderWordOfTheDay(item) {
     const { navigate } = this.props.navigation;
     return (
      <ListItem
        title={
              <Text item={item}
               onPress={() =>
               navigate('Details', {...item} )}
               />
              }
        />
      );
  }

}

我有一个错误null is not an object(evaluating 'this.state.dataSource')： Screenshot here

我的问题是如何重写所有的ListenForItems，ComponentDidMount ......？如何使用数据库？在新组件？

Answer 1

首先将空列表设置为数据源：

networkx

然后在componentWillMount中填写它：

constructor(props) {
    super(props);

    const ds = new ListView.DataSource({ rowHasChanged: (r1, r2) => r1 !== r2 });
    this.state = {
        dataSource: ds.cloneWithRows([])
    };
}

在多个组件中重用firebase

1 个答案: