用几个数据数组反应原生平面列表 [英] react native flatlist with several arrays of data

查看:27
本文介绍了用几个数据数组反应原生平面列表的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我是 RN 的新手,需要一些帮助我有一个像

I'M new to RN and need some help I have an object like

{title:"title",price:"price",subtitle:"subtitle"}

我想在 flatlist 中使用 2 个值,就像这里一样 -

And I'd like to use 2 values at flatlist, like here -

<FlatList
        data={this.state.data}
        renderItem={({ item }) => (
          <ListItem
            title={`${item.name.first} ${item.name.last}`}
            subtitle={item.email}
         />
        )}

      />
    </List>

但是在这个例子中没有显示数据结构,所以我很困惑我该怎么做.请帮我解决它!最后(渲染)我需要一个 ListItem 这个视图 -

But in this example wasn't show structure of data so I'm confused what should I do. Please help me to solve it! At the end (render) I need a ListItem this view -

(title)  (price)

或者我应该更好地使用 native-base,但是关于 2 值的相同问题,传递给列表项

Or I should better use native-base, but the same questions about 2 value, passing to list item

推荐答案

你必须将一个数组传递给 data 属性,然后你可以这样做:

You have to pass an array into the data property, then you can do:

<FlatList
    data={this.state.data}
    renderItem={({ item }) => ( //this part will iterate over every item in the array and return a listItem
      <ListItem
        key={item.id}
        title={item.title}
        price={item.price}
     />
    )}

  />
</List>

这篇关于用几个数据数组反应原生平面列表的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆