时间戳

首页 > 解决方案 > React Native flexShrink 默认是 1，但好像是 0

css - React Native flexShrink 默认是 1，但好像是 0

问题描述

根据Docs，RN 中 flexShrink 的默认值为 1。但是，鉴于下面的代码，我必须将其显式设置为 1 才能使其工作，默认情况下似乎为 0。预期的行为是所有内部容器的宽度都应该缩小，以便默认情况下它们都适合屏幕。但它不会那样做，除非我取消注释这些行。谢谢你的时间

<View
      style={{
        flexDirection: "row",
      }}
    >
      <View
        style={{
          backgroundColor: "green",
          width: 100,
          height: 200,
          // flexShrink: 1,
        }}
      />
      <View
        style={{
          backgroundColor: "red",
          width: 100,
          height: 200,
          // flexShrink: 1,
        }}
      />
      <View
        style={{
          backgroundColor: "blue",
          width: 100,
          height: 200,
          // flexShrink: 1,
        }}
      />
      <View
        style={{
          backgroundColor: "maroon",
          width: 130,
          height: 100,
          // flexShrink: 1,
        }}
      />
    </View>

标签： cssreact-nativeflexboxreact-native-flexbox

解决方案

看起来文档现在已经更正了。

现在它说：

flexShrink 接受任何 >= 0 的浮点值，其中 0 是默认值（在网络上，默认值为 1）

我在这里找到了doc 的更改日志：

https://github.com/facebook/react-native-website/commit/2007c56fd09262cdb6803a2193a65fe555ef8344

最新文档在这里：

https://reactnative.dev/docs/flexbox

发表于 2021 年 12 月 31 日

推荐阅读