在 ES6 中导出函数/反应

Exporting function in ES6 / react

在服务器端 (nodejs/express),我在导出和引用此文件时没有问题(使用 Attempt1)。

// collectionFile.js
function collection() {
    let data = {};
    function getData(key) {
        return data[key];
    }
    function setData(key, value) {
        data[key] = value;
    }
    return {
        getData: getData,
        setData: setData
    };
}

const instanceOfCollection = collection();

在客户端 (React),我无法引用和访问 getData 函数。以下是我尝试过的一些组合。 None 他们工作。我怎样才能让它发挥作用?

// Attempt1: export
// module.exports.getter = instanceOfCollection.getData;

// Attempt1: import
// const getter = require('./collectionFile').getter;
// Uncaught TypeError: getter is not a function

// Attempt2: export
// export default { instanceOfCollection };

// Attempt2: import
// import instanceOfCollection from './collectionFile';
// const instance = instanceOfCollection.getData;
// Uncaught TypeError: Cannot read property 'getData' of undefined

// Attempt3: export
// export const instanceOfCollection = collection();

// Attempt3: import
// import { instanceOfCollection } from './collectionFile';
// const instance = instanceOfCollection.getData;
// Uncaught TypeError: Cannot read property 'getData' of undefined

编辑:结果我之前从文件 B 引用了文件 A,还从文件 A 引用了文件 B

有很多方法可以做这样的事情:

  1. ES5 导出

    module.export = instanceOfCollection

    然后

    var getData = require('my_module').getData

  2. ES6 导出

    export default instanceOfCollection

    然后

    import { getData, setData } from 'my_module'

  3. ES6 命名导出

    export const setter = instanceOfCollection.setData export const getter = instanceOfCollection.getData

    然后

    import { setter, getter } from 'my_module'

    import * as myCollection from 'my_module' myCollection.getter() myCollection.setter()

  4. ES5 重命名

    module.export = { getter: instanceOfCollection.getData, setter: instanceOfCollection.setData, }

    然后

    const { setter, getter } = require('my_module')

    const getter = require('my_module').getter const setter = require('my_module').setter

希望其中一些对您有用。