React native 扁平列表中标题和正文的分隔符样式

目前，我对平面列表有一个问题。 我有一个组件来呈现一个列表书。 根据设计，标题的宽度是屏幕的宽度，主体将左右填充10px

所以我使用了

contentContainerStyle={{paddingHorizontal:10}

。 但结果是头部和身体是10px左右填充

请提出解决方法。对不起，我的英语不好

更新：我很抱歉没有详细描述我的问题

在

main.tsx中

...
public render() {
  return (
    <FlatList
      key...
      data={..}
      renderItem={this.renderItems}
      ListHeaderComponent={this.renderHeader}
      contentContainerStyle={styles.contentStyle}
    />
  );
}

private renderHeader = () => {
  return (
    <View style={style.header}
      //TODO something ...
    </View>
  );
}

private renderItems: ListRenderItem<IBook> = ({ item: {bookId} }) => bookId ?
  (
    <BookGridCell
      title={...}
      image={...}
      //TODO more..
    />
  ) : <View style={styles.emptyBox} /> 
}

。。。
公共渲染（）{
返回(
);
}
私有renderHeader=（）=>{
返回(
书呆子？
(
) :  
}

在

renderItems

中，我调用了一个组件

BookGridCell

。在这个组件中，设置了一本书的设计。因此，如果我直接在

renderItems

中添加样式，每本书的左右边距将为10px，而不是整个正文

当使用

contentContainerStyle

直接在

renderItems中添加样式时

给你的身体一种风格

style={styles.bodyContainer}

然后在样式表中添加属性

    const styles = StyleSheet.create({
    bodyContainer: {
      paddingHorizontal: 10    
      },

这是正确的方法

您可以直接在视图中添加填充

style={{ paddingHorizontal: 10 }}

---

从contentContainerStyle中删除填充，并将填充添加到项目的design@BrijeshShiroya我更新了我的问题。你能再次看到它吗？我更新了我的问题。你能看到它并建议我吗？这会设置列表正文、页眉和页脚的样式。没有用。