当水平为真时，百分比不适用于 FlatList 渲染项

Question

我想在 horizontal FlatList 的渲染项上使用屏幕的宽度。但是，它没有按预期工作。当 horizontal 为假时，百分比值起作用。但是当 horizontal 为真时，百分比值不起作用。

class App extends React.Component {
  _renderItem = ({ item }) => {
    return (
      <View
        style={{
          width: '100%',
          height: 100,
        }}>
        <Text>{item.key}</Text>
      </View>
    );
  };

  render() {
    return (
      <View style={styles.container}>
        <FlatList
          data={[{ key: 1 }, { key: 2 }, { key: 3 }]}
          renderItem={this._renderItem}
          horizontal={true}
        />
      </View>
    );
  }
}

Snack link when the FlatList is horizontal

Snack link when the FlatList is NOT horizontal

Answer 1

我想我记得有人提到过类似的事情。使用维度在这里工作。看这里：https://snack.expo.io/H1-wnC5HM

我宁愿用 flex 或百分比来解决它，但很好。

当水平为真时，百分比不适用于 FlatList 渲染项

Percentage does not work with FlatList render item when horizontal is true

react-native

react-native-flatlist