2

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

例如,使用这个 JSON,假设我想为那里的电影数量渲染按钮,每个按钮都有电影的名称。电影的数量会有所不同。

4

2 回答 2

1

如果您在这样的 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>
    );
  }

在此处查看完整代码

于 2018-08-21T06:23:17.027 回答
0

抓取

  • 创建 api。
  • 在 sagas 中创建函数获取
  • 设置索引(sagas)
  • 创建 redux reducer 以从 fetching 中获取数据
  • 在组件映射redux状态获取数据

制作清单项目

  • 尝试渲染函数使用返回 ListItem
  • 它不杂乱无章
于 2018-08-20T02:24:28.387 回答