Question

它在文档https://facebook.github.io/react-native/docs/native-components-android.html上说＆＃34; ViewManagers是单例对象＆＃34;

如果是这样，我将如何创建我的UI对象的另一个实例 - 例如在另一个屏幕上说。

以下是我的代码的小片段：

JS：

import PropTypes from 'prop-types';
import React from 'react';
import { requireNativeComponent } from 'react-native';

var DataViewNative = requireNativeComponent('DataView', myClass);

class myClass extends React.Component {

  constructor() {
    super();
  }

  render() {
    return (
      <DataViewNative {...this.props} />
    );
  }
}

myClass.propTypes = {
  graphType: PropTypes.string,
};

module.exports = myClass;

native ios（swift）：

@interface RCT_EXTERN_MODULE(DataViewManager, RCTViewManager)

@end


@objc(DataViewManager)
class DataViewManager: RCTViewManager {

  override func view() -> UIView! {
    return myCustomView()
  }

}

我希望能做什么（js）：拨打：

 <myClass/>

在两个不同的屏幕上的两个不同的render（）方法。会发生的事情是，由于RCTViewManager是一个单例对象，对view（）的调用会替换旧的调用，因此只有最近的调用才会有UIView

Answer 1

事实证明，我在问题中写的“简化版”实际上就是答案。这是我原来的（不工作的）代码：

var view  = MyCustomView()

override func view() -> UIView! {
  return view
}

与以下文档相反： https://github.com/facebook/react-native/blob/26d3af3421f0768cc2d4aeb354068ace3f7581e3/React/Views/RCTViewManager.h#L35-L42

React-Native：如何创建Native UI组件的多个实例？

1 个答案: