2023年1月14日，React Native官网公布了0.71版本，此版本带来了很多重磅和突破性的更新，同时，感激70多位贡献者带来的了1000屡次提交。上面是0.71版本带来的次要更新内容：

  • 默认开发语言为TypeScript
  • 应用Flexbox Gap使布局更加简略
  • 开发者体验晋升
  • 无关新架构内容的降级
  • 引入的局部web开发规范的属性，款式及事件
  • 复原PropTypes
  • 其余更新

TypeScript成为默认开发语言

从0.71版本开始，咱们将React Native的默认开发语言从JavaScript变成TypeScript，在新建的我的项目的时候会有所体现，与此同时我的项目根目录会减少一个tsconfig.json文件用于辅助开发者编写语法正确的Ts代码。另外0.71版本因自身已反对ts，所以不须要再package.json文件中增加@types/react-native依赖。

无关TypeScript，咱们能够将它了解为是增强版JavaScript。TypeScript 由微软开发的自在和开源的编程语言，是 JavaScript 的一个超集，反对 ECMAScript 6 规范（ES6 教程）。TypeScript 设计的初衷就是为了应答大型利用开发，它能够编译成纯 JavaScript，最终运行在浏览器环境中。

Flexbox Gap让布局更加简略

此版本引入了web开发规范的属性gap、rowGap、columnGap，应用这些属性能够很不便的设置组件距离。并且，在将来的版本中，咱们还会减少百分比布局。
那gap、rowGap、columnGap属性到底有什么用呢？比方设置组件之间距离为margin: 10，其成果如下图。


margin的作用就是用在所有子元素的外边缘，并且在Flexbox布局中下不会生效，次要用于设置元素内部的间距。同时，咱们还能够通过设置非平均边距、在父元素上应用负边距等来使得布局开发变得更加容易。

比方，应用gap属性，咱们还能够在容器上设置gap: 10来实现卡片外部边距，如下图所示:


如果想要理解更多Flexbox gaps的内容，能够参考 blogpost from CSS Tricks。

Web属性反对

此版本增加了很多Web属性的反对，使得React Native的api和Web平保持一致，比方 accessibility, behavior和style props等。这些新属性都是是附加的，因而对于等效的可拜访性、行为或款式，不会呈现什么异样影响，比方Image和TextInput组件。

Accessibility

比方，咱们引入ARIA属性作为React Native的根底属性。事实上，这些属性存在咱们简直所有的React Native组件中，比方aria-label, aria-labelledby,aria-modal, id, aria-busy, aria-checked, aria-disabled, aria-expanded, aria-selected, aria-valuemax, aria-valuemin, aria-valuenow, and aria-valuetext。

并且，咱们行将在将来的版本中引入其余一些行为属性，比方aria-hidden, aria-live, role和 tabIndex等。如果想要理解更多对于Accessibility的内容，能够关上Web Props umbrella issue。

Specific Behavior

将来，为了对齐Web规范，咱们还会再根底组件中引入更多的可拜访性、行为或款式等属性，比方Image和TextInput组件。

  • Image: alt, tintColor, crossOrigin, height, referrerPolicy, src, srcSet, and width.
  • TextInput: autoComplete, enterKeyHint, inputMode, readOnly, and rows.

Styles

为了与Web平台的css款式保持一致，咱们在React Native中增加了如下的款式反对。

  • aspectRatio：当初反对字符串类型的值
  • fontVariant：当初反对空格分隔的字符串值
  • fontWeight：当初反对数值类型的值
  • transform：当初反对字符串类型的值

同时，以下款式属性也被增加到现有React Native款式中。

  • objectFit
  • pointerEvents
  • userSelect
  • verticalAlign

想要理解更多的Styles属性，能够参考Web Styles umbrella issue。

Events

最初，咱们还增加了PointerEvents可选择项，一旦开启这一个性，解决View视图上的以下事件时将反对悬停。

  • onPointerOver, onPointerOut
  • onPointerEnter, onPointerLeave

当然，下面的事件对于 React Native的Pressability也同样实用。如果要开启这一个性，须要将上面的内容设置为true。

import ReactNativeFeatureFlags from 'react-native/Libraries/ReactNative/ReactNativeFeatureFlags';// enable the JS-side of the w3c PointerEvent implementationReactNativeFeatureFlags.shouldEmitW3CPointerEvents = () => true;// enable hover events in Pressibility to be backed by the PointerEvent implementation.// shouldEmitW3CPointerEvents should also be trueReactNativeFeatureFlags.shouldPressibilityUseW3CPointerEventsForHover =  () => true;

复原PropTypes

React Native的prop，如ViewPropTypes和Text.propTypes，在0.66版本中被弃用，如果间接应用它们会输入过期的正告，并且在0.68版本中咱们移除了对prop的反对，如果在0.68及以上版本中应用它将会遇到谬误。

不过，最近的一些考察让咱们意识到弃用这一个性是谬误的。首先，弃用正告并不总是可行的，这导致人们漠视了它们（比方issue one， issue two） 。其次，LogBox.ignoreLogs谬误地过滤了弃用正告。不过，当初这两个问题都曾经失去修复。

因而，在这个版本中，咱们将从新增加了React Native的propTypes，以便开发者更容易的降级和迁徙代码。同时，咱们在0.71版本中更新了之前弃用的deprecated-react-native-prop-types插件包。不过，咱们依然打算在将来弃用并删除props。咱们冀望当咱们从新移除时，社区不会呈现之前那么多的问题。

开发者体验改善

React DevTools

在这个版本中，咱们减少了两个比拟好用的调试代码工具，即点击元素检查和组件高亮。 这对于咱们开发中调试布局页面来说更加敌对，也更加容易让咱们定位组件元素，上面是演示图。

Hermes

在0.70版本中，咱们将Hermes作为了React Native的默认引擎。在0.71版本中，咱们对Hermes引擎做了进一步的降级，包含如下：

  • JSON.parse性能晋升30%
  • 减少对String, TypedArray, and Array属性at()的反对
  • 在Metro中通过网络实现加载source maps

新架构

当然，在这个版本中，咱们也带来了诸多对于新架构体验及性能方面的降级。

  • 大幅度缩小了Android平台的编译工夫，并解决了诸多Window平台的编译问题
  • 当初能够启用新体系结构，而无需在应用程序中增加任何C++代码，并且CLI应用程序模板已革除所有C++代码和CMake文件。
  • 在iOS平台设置开启新架构反对更加简介
  • 在iOS平台，在podspec中新增了install_module_dependencies函数用于治理所有须要的依赖项。

其余重大修复

  • 更好的堆栈帧治理：咱们曾经更新了React Native的外部帧列表，因而调用LogBox将将会更加频繁，能够帮忙开发者更快地调试问题。
  • 构建工夫改良：咱们将assets局部代码迁徙到Maven Central中，以改善Hermes在以后和新架构下的构建工夫(iOS和Android)。
  • Android模板改良：Android模板被清理，当初齐全依赖于React Native Gradle插件，开发者能够间接在React Native Gradle Plugin中找到配置阐明。

其余重大更新

除了下面的介绍的更新外，此版本还带来了如下一些重大更新。

  • 更改控制台日志：当初间接应用LogBox.ignoreLog不再过滤控制台日志，这意味着会在控制台中看到LogBox中静默的日志。无关更多细节，请参阅LogBox.isIgnoredLog() 。
  • 移除AsyncStorage和MaskedViewIOS：这些组件在0.59版本已被弃用，所以是时候齐全删除它们了。对于代替计划，请查看React Native社区的替换计划。
  • JSCRuntime移到react-jsc： react-jsi当初分为react-jsc和react-jsi两局部。如果须要应用JSCRuntime，只须要增加react-jsc作为依赖项即可。

参考文档：https://reactnative.dev/blog/2023/01/12/version-071