微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

具有相同宽度的标题和行的 react-native-table-component 列,其中数据可以具有动态长度

如何解决具有相同宽度的标题和行的 react-native-table-component 列,其中数据可以具有动态长度

我正在使用“react-native-table-component”将 API 获取的数据显示为表格格式。 我做过这样的事情 -

<ScrollView horizontal={true}>
      <View style={styles.container}>
           <Table borderStyle={{borderWidth: 1,borderColor: '#ffa1d2'}}>
        {       <Row data={headers} style={styles.HeadStyle} textStyle={styles.TableText}/>}
                <Rows data={inarray} style={{width:'100%'}} textStyle={styles.TableText}/>
           </Table>
      </View>
</ScrollView>

这里的 headers 和 inarray 分别保存了 headers 和 rows 数据。

我的样式组件是 -

const styles = StyleSheet.create({
    container: { 
      flex: 1,// padding: 18,paddingTop: 35,paddingHorizontal: 30,backgroundColor: '#ffffff' 
    },HeadStyle: { 
      height: 70,alignContent: "center",backgroundColor: '#ffe0f0'
    },TableText: { 
      margin: 10,width: 'auto'
    },});

我得到这样的水平滚动表 -

enter image description here

现在我的问题是如何设置标题列和剩余行的宽度相同?我不能使用 widthArr,因为名称可能具有动态长度。

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。