React Native：如何有选择地启用LayoutAnimation

我想为某些组件启用布局动画,但一旦激活,所有渲染的组件都会受到布局动画的影响.例如,我有

<container>
  <waterfall/>
  <menu/>
</container>

我只希望为组件菜单使用布局动画,但动画应用于瀑布渲染,瀑布渲染已经有自己的动画代码.

这可能与本地的反应吗？

我遇到了类似的问题,这是我用layoutanimation解决它的方法：

说明

将容器组件中的状态变量保存为菜单的prop：< menu reload = {this.state.doSomethingInMenu}>

在容器组件中,使用setTimeout设置菜单变量,以便将控件传递回DOM,并且将呈现更改(无动画).运行setTimeout后,变量将更新,菜单道具将更改,从而导致重新加载.

在菜单组件中,检查该变量是否已更新为您期望的值.如果有,请调用LayoutAnimation.configureNext.这将导致下一个渲染(只是菜单更改)动画.

代码概述

容器组件

getInitialState: function() {
  return { doSomethingInMenu: false };
},

// Do something that causes the change
// Then call setTimeout to change the state variable
setTimeout(() => {
  this.setState({ doSomethingInMenu: true });
},750)

<menu reload={this.state.doSomethingInMenu} />

菜单组件

componentWillReceiveProps: function(nextProps) {
    if (nextProps.reload) {
      LayoutAnimation.configureNext(LayoutAnimation.Presets.spring);
      // Set the menu state variable that causes the update
      this.setState({field: value})
    }
  },