在 react-native 中使用模块化定义模式答案

【问题标题】：Use modular define pattern in react-native在 react-native 中使用模块化定义模式
【发布时间】：2015-08-06 09:56:11
【问题描述】：

我有一些 web 应用程序模块（我将其视为对象类），我想在 react-native 中重用它们。

但是 define 不起作用。我试过 amdefine 但没有成功。我得到的错误是“定义未定义”。有什么想法吗？

一个例子：

调用者（index.ios.js）：

var React = require('react-native');
var ExampleClass = require('./app/ExampleClass');
....

定义：

define('ExampleClass', [
    // imports
    'ParentClass',
    'ExampleImport',
    'ExampleImport2',
], function(ParentClass, ExampleImport, ExampleImport2) {

    /**
     * @class ExampleClass
     */
    var ExampleClass = ParentClass.extend('ExampleClass');

    ExampleClass.prototype.init = function() {
        ParentClass.prototype.init.call(this);
        var oExampleImport = new ExampleImport();
        oExampleImport.doStuff();
    };


    ExampleClass.prototype.doSomething = function(oData, oStatus) {
       .....
       var oExampleImport2 = new ExampleImport2();
       oExampleImport2.doMoreStuff();
    };

    return ExampleClass;
});

【问题讨论】：

你能展示一下尝试使用它的代码吗？还有错误。
根据您的需要更新了问题。 :)

标签： javascript react-native amdefine

【解决方案1】：

所以经过一番调查，我想出了一个解决方案（我仍然需要实施：:p）：

将共享模块隔离为通用节点模块

'use scrict';

let Module2 = require('../app/modules/Module2');

let Module = {};

Module.prototype.init = function() {
   let m2 = new Module2();
   m2.doSomething();
};

module.exports = Module;

我当然可以使用class 结构等使这个更像ES6。

使用 browserify 或 webpack 之类的东西来打包项目：

这将允许网络应用程序能够使用共享模块（例如，它可以理解 module.exports 和 ES6 语法等代码）。

它也会像一个大包裹一样。
只有视图特定于目标平台（iOS、网络浏览器）：

每个视图类都只是require 必要的子类。

欢迎评论。 :)

【讨论】：