Question

我有一个从firebase数据库中检索数据的基本组件，并更新状态对象。然后我尝试将this.state.data传递给导出函数以查看数据库中的数据，但它会丢弃数据的未定义错误（因为数据中没有任何内容）。 / p>

＆＃13;

/**
========= LaunchScreen ==========
**/
export default class LaunchScreen extends PureComponent<*, State> {

constructor(props) {
    super(props);
    this.state = { data: [] };
    this.personsRef = firbaseApp.database().ref().child('Persons');
    this.listenForPersons = this.listenForPersons.bind(this);
  }

  componentDidMount = () => { this.listenForPersons(this.personsRef); };

  listenForPersons = (personsRef) => {
    personsRef.on('value', (snap) => {
      var persons = [];
      snap.forEach(child => {
        persons.push({
          name: child.val().name,
          _key: child.key
        })
      });
      this.setState({data: persons});
    });
  };



  _renderScene = ({ route }) => {
    console.log(this.state.data);
    switch (route.key) {
      case '1':return ( <SimplePage state={this.state} /> );
      case '2': return ( <SimplePage state={this.state} /> );
      default: return null;
    }
  };

 
  render() {
    return (
        <TabViewAnimated renderScene={this._renderScene} />
    );
  }
}

＆＃13;

SimplePage

＆＃13;

export default function CurrentStateIndicator({ state, style }: *) {
  return (
    <View>
      <View>
        <Text>Current route is: {state.routes[state.index].title || state.index}</Text>
      </View>
    <List>
      <FlatList
        data={state.data}
        renderItem={({ person }) => (
          <ListItem
            title={person.name}
          />
        )}
      />
    </List>
    </View>
  );
}

＆＃13;

但显然，在SimplePage中未定义state.data。

任何人都可以帮我解决如何将更新的state.data传递给simplePage。

由于

Answer 1

  listenForPersons = (personsRef) => {
    personsRef.onSnapshot( (snap) => {
      var persons = [];
      snap.forEach(child => {
        persons.push({
          name: child.val().name,
          _key: child.key
        })
      });
      this.setState({data: persons});
    });
  };

状态中的state.data未在导出函数中更新？

1 个答案: