Question

我想列出用户可以点击的按钮元素列表。按钮元素的数量将在3-5之间变化，具体取决于我执行的获取请求的结果。我知道如何根据获取请求的结果而不是按钮的内容填充清单。有帮助吗？

例如，using this JSON，假设我想为其中的电影数量渲染按钮，每个按钮都有电影的名称。电影的数量会有所不同。

Answer 1

正在获取

创建api。
在sagas中创建函数获取
设置索引（传奇）
创建redux reducer来获取数据
在组件映射redux状态下获取数据

制作列表项

尝试使用渲染功能使用return ListItem
不混乱

Answer 2

如果您将影片设置为像这样的Api响应后的状态。

this.setState({movies: apiResponse.movies})

  

renderMovieList(){
    return  this.state.movies.map((movie, i, movieArray) =>
      <View 
        key={movie.id} 
        style={{ height:50, padding:20}}>
        <Button
          onPress={()=> this.handleOnPress(movie)}
          title={movie.title}
          color="#841584"
          accessibilityLabel="Learn more about this purple button"
        />
      </View>
    )
  }
  
  handleOnPress(movieDetails){
   alert(movieDetails.title);
  }

  render() {
    return (
      <View style={{flex: 1, justifyContent:'center', backgroundColor: "#0d98ba"}}>
        {this.state.movies.length? this.renderMovieList(): null}
      </View>
    );
  }

See full code here

React Native：在Fetch（Url）请求中给定数据的情况下，制作按钮元素列表的最佳方法是什么？

2 个答案: