Javascript 无法验证对导入命名空间的计算引用

Question

不确定我是否需要添加另一个 jshint 库，或者我是否应该以不同的方式执行此操作。

我有一个文件(出于解释原因，我们将其称为 stuff-functions.js)导出这样的函数...

export function a() {
    return 'stuff';
}

export function b() {
    return 'more stuff';
}

export function c() {
    return 'even more stuff';
}

在另一个文件中，我正在导入该文件并通过参数调用该函数...

import * as stuffFunctions from './stuff-functions'

export default class someReactClass {
    myFunc(functionToCall) {
        return stuffFunctions[functionToCall]();
    }
    ...
}

它工作正常，但在控制台中我收到一个 eslint 错误...

Unable to validate computed reference to imported namespace 'stuffFunctions'

那么，我应该采取不同的方式来解决这个问题，还是寻找某种允许这样做的 eslint 库？

编辑...

我添加了这一行来阻止错误//eslint-disable-line

我只是好奇是否有更好的方法来做到这一点。也许像...

import {a, b, c} from './stuff-functions';

export default class someReactClass {
    myFunc(functionToCall) {
        const myStuffFunctions = {
            a: a,
            b: b,
            c: c
        };

        return myStuffFunctions[functionToCall]();
    }
    ...
}

虽然看起来多余。 :/

Answer 1

错误是由 eslint-plugin-import 中的 import/namespace 规则报告的插入。它的发生是因为您正在决定将在运行时调用哪个导入函数:

stuffFunctions[functionToCall]();

插件的静态分析无法验证这是一个有效的导入，并将其报告为错误。

最简单的解决方案是添加 ESLint 注释以将规则重新配置为 allow computed references :

/*eslint import/namespace: ['error', { allowComputed: true }]*/
import * as stuffFunctions from './stuff-functions'

export default class someReactClass {
    myFunc(functionToCall) {
        return stuffFunctions[functionToCall]();
    }
    ...
}