Javascript 如何在react native中以表格格式显示数据？

我需要在我的应用程序中以表格格式显示数据。我想要这样的东西“

如何在表格的第一个标题旁边添加一个下拉图标，并设计与上图类似的代码？

试试这个软件包

import React，{Component}来自'React'；
从“react native”导入{StyleSheet，View}；
从“react native Table component”导入{Table，Row，Rows}；
导出默认类ExampleOne扩展组件{
建造师（道具）{
超级（道具）；
此.state={
桌面：[“访问日期”、“成员”、“您…”等]，
表格数据：[
['07/29/2016'，'JEFF'，'46.80'，'，
['07/29/2016'，'JEFF'，'46.80'，'，
['07/29/2016'，'JEFF'，'46.80'，'，
['07/29/2016'，'JEFF'，'46.80'，'
]
}
}
render（）{
const state=this.state；
返回(
)
}
}
const styles=StyleSheet.create({
容器：{flex:1，padding:16，paddingTop:30，backgroundColor:'#fff'}，
头部：{高度：40，背景颜色：'#f1f8ff'}，
正文：{页边空白：6}
});

您可以从中使用数据表

从'react native paper'导入{DataTable}；
常量MyComponent=（）=>(
甜点
卡路里
脂肪（g）
);

---

sortDirection='descending'将帮助您在标题旁边添加下拉图标。

感谢@Selmi提供的解决方案，但我想知道如何在中在标题1旁边添加下拉图标table@SelmiKarim如何为表中显示的文本设置自定义字体大小？

import React, { Component } from 'react';
import { StyleSheet, View } from 'react-native';
import { Table, Row, Rows } from 'react-native-table-component';

export default class ExampleOne extends Component {
  constructor(props) {
    super(props);
    this.state = {
      tableHead: ['Visite Date', 'Member', 'you ...', 'etc..'],
      tableData: [
        ['07/29/2016', 'JEFF', '$46.80', '...'],
        ['07/29/2016', 'JEFF', '$46.80', '...'],
        ['07/29/2016', 'JEFF', '$46.80', '...'],
        ['07/29/2016', 'JEFF', '$46.80', '...']
      ]
    }
  }

  render() {
    const state = this.state;
    return (
      <View style={styles.container}>
        <Table borderStyle={{borderWidth: 2, borderColor: '#c8e1ff'}}>
          <Row data={state.tableHead} style={styles.head} textStyle={styles.text}/>
          <Rows data={state.tableData} textStyle={styles.text}/>
        </Table>
      </View>
    )
  }
}

const styles = StyleSheet.create({
  container: { flex: 1, padding: 16, paddingTop: 30, backgroundColor: '#fff' },
  head: { height: 40, backgroundColor: '#f1f8ff' },
  text: { margin: 6 }
});

import { DataTable } from 'react-native-paper';

const MyComponent = () => (
  <DataTable>
    <DataTable.Header>
      <DataTable.Title
        sortDirection='descending'>Dessert</DataTable.Title>
      <DataTable.Title numeric>Calories</DataTable.Title>
      <DataTable.Title numeric>Fat (g)</DataTable.Title>
    </DataTable.Header>
    </DataTable> );