Question

最近，很快就会发现React将弃用using System; using Android.App; using Android.Content.PM; using Android.Runtime; using Android.Views; using Android.Widget; using Android.OS; namespace App5KittyOp.Droid { [Activity(Label = "App5KittyOp", Icon = "@drawable/icon", Theme = "@style/MainTheme", MainLauncher = true, ConfigurationChanges = ConfigChanges.ScreenSize | ConfigChanges.Orientation)] public class MainActivity : global::Xamarin.Forms.Platform.Android.FormsAppCompatActivity { protected override void OnCreate(Bundle bundle) { System.Diagnostics.Debug.WriteLine("In OnCreate"); TabLayoutResource = Resource.Layout.Tabbar; ToolbarResource = Resource.Layout.Toolbar; base.OnCreate(bundle); global::Xamarin.Forms.Forms.Init(this, bundle); LoadApplication(new App()); } } }，并且它的新地方是新的静态函数componentWillReceiveProps。 See more here

我目前正在将我的应用迁移到这个新API，但由于我正在使用重构库来处理更高阶的组件，因此getDerivedStateFromProps存在问题。我们通过库的生命周期对象使用getDerivedStateFromProps道具。

所以在转移到新API之前，我有这个：

componentWillReceive

现在已更改为以下内容：

export function someHoC () {
  return compose(
    lifecycle({
      componentWillReceiveProps (nextProps) {
        const { fetch } = nextProps
          if (shouldFetch(this.props, nextProps)) {
             fetch()
          }
      }
    })
  )
}

但是，export function someHoC () { return compose( lifecycle({ getDerivedStateFromProps (nextProps) { const { fetch } = nextProps if (shouldFetch(this.props, nextProps)) { fetch() } } }) ) }必须是静态的，因此我会收到有关该问题的警告，并且不知道如何处理它。

warning.js？7f205b4：33警告：生命周期（MyComponent）：getDerivedStateFromProps（）被定义为实例方法，将被忽略。相反，将其声明为静态方法。

如何将静态生命周期方法传入我的组件？

Answer 1

如果您想使用getDerivedStateFromProps，则需要将其声明为static method：

static getDerivedStateFromProps() {...}

显然，这会使getDerivedStateFromProps变为静态，这意味着您无法像调用componentWillReceiveProps一样调用它。

如果静态方法不适合您，您可以将逻辑移至componentDidUpdate以使警告静音。但是，如果从此方法调用setState()，则可能会导致其他渲染。根据您解决fetch()时的情况，这可能对您有用。

您也可以将componentWillReceiveProps替换为UNSAFE_componentWillReceiveProps（docs），这将以相同的方式工作。但是，由于即将推出的异步呈现功能this could cause some issues。

Answer 2

您应该在生命周期内使用以下内容

setStatic('getDerivedStateFromProps', (nextProps, prevState) => {})并将以前的值存储在组件状态中，以便从prevState参数

中检索它

如何在重构库中使用HoC创建React的新静态函数getDerivedStateFromProps作为生命周期方法？

2 个答案: