setNativeProps

在做一些高频动画效果时由于需要经历JS层的多次重新渲染，会出现滞后卡顿的现象，setNativeProps提供了ElementNode下"简单粗暴"的方法直接修改终端原生组件的样式来优化性能，该方法目前只能修改 style 样式，其余属性暂不支持。P.S. 可能产生的数据同步等逻辑上的副作用需要业务自行解决

React

[范例：SetNativeProps.jsx]

除了element component（如div）外，React 没有直接暴露 ElementNode 给业务使用，可以通过 React.forwardRef 转发，或者使用 Hippy 提供的 UIManagerModule.getElementFromFiberRef 方法（该方法会从当前节点逐个遍历子节点直到找到 ElementNode 元素并返回，有一定性能损耗）获取第一个 ElementNode，使用 demo 如下：

javascript

 class BusinessComponent extends React.Component {
    constructor(props) {
      super(props);
      this.customComRef = null;
    }
    componentDidMount() {
       const customElementDom = UIManagerModule.getElementFromFiberRef(this.customComRef);
       customElementDom.setNativeProps({
         style: { height: 100 }
       })
    }
   render() {
      return <CustomComponent ref={ref => this.customComRef = ref} />
   }
 }

Vue

[范例：demo-set-native-props.vue]

Vue 如果是 HTML 元素，直接通过$refs可以获取到 DOM；如果是自定义组件，可以通过$refs.x.$el 获取，setNativeProps使用方法和 React 一致