>

파이어베이스에서 데이터를 가져 와서 배열에 저장하고 있습니다. 이제 플랫리스트를 사용하여 표시하고 싶지만 어떻게해야할지 모르겠습니까?

class HomeScreen extends Component{
  constructor(props){
    super(props);
    this.state={
      menu:[]
    }
  }
  // componentDidMount() {
  //   firebase.auth().onAuthStateChanged(authenticate => {
  //     if (authenticate) {
  //       this.props.navigation.replace("Home");
  //     } else {
  //       this.props.navigation.replace("login");
  //     }
  //   });
  // }
   componentDidMount() {
    firebase.database().ref('menu/starter/').once('value').then(snapshot => {
       var items = [];
       snapshot.forEach((child) => {
         items.push({
            name: child.val().name,
            image: child.val().image,
            price: child.val().price,
         });
      });
      this.setState({ menu: items});
      console.log(this.state.menu)
  });
  }
  render(){
    return(
     <View style={styles.container}>
     <Text></Text>
     </View>
    )
  }
}

  • 답변 # 1

    <FlatList 
    data={this.state.menu}
    keyExtractor={elem => elem.name}
    renderItem={elem => (<View><Text>{elem.item.name}</Text></View>)}
    />
    
    

    renderItem은 각 배열 항목을 렌더링하는 콜백입니다

관련 자료

  • 이전 python - kubernetes 포드의 환경 변수를 일시적으로 변경하려면 어떻게해야합니까?
  • 다음 vb.net - 이 Visual Basic 프로그램을 컴파일 할 수 없습니다