Question

在aliases.js中，我试图访问＆＃39; SELECT_HOST＆＃39;导入的actionTypes对象的属性值。但是，这会导致＆＃34; SyntaxError：意外的令牌，预期，＆＃34;错误，根据Webpack。我无法确定actionTypes.SELECT_HOST中的语法错误是什么，这是访问对象属性值的标准点符号方式。

actionTypes.js：

const actionTypes = {
    SELECT_HOST : 'SELECT_HOST',
    INVOKE_ASSESSMENT : 'INVOKE_ASSESSMENT',
    RETRIEVE_ASSESSMENT : 'RETRIEVE_ASSESSMENT',
    RETRIEVE_OPTIONS : 'RETRIEVE_OPTIONS',
    RETRIEVE_RESULTS : 'RETRIEVE_RESULTS',
    UPDATE_OPTIONS : 'UPDATE_OPTIONS'
};

export default actionTypes;

aliases.js：

import actionTypes from '../actions/actionTypes';

const selectHost = (host) => {
    chrome.tabs.query({currentWindow: true, active: true}, (tabs) => {
        host = new URL(tabs[0].url).hostname;
    });
    const action = {
        type: actionTypes.SELECT_HOST,
        host
    };
    return action;
};

export default {
    actionTypes.SELECT_HOST: selectHost
};

Webpack抛出错误：

ERROR in ./src/aliases/aliases.js
Module build failed: SyntaxError: Unexpected token, expected ,     (15:12)

  13 | 
  14 | export default {
> 15 |  actionTypes.SELECT_HOST: selectHost
     |             ^
  16 | };

Answer 1

如果您尝试使用actionTypes.SELECT_HOST的值作为您要导出的对象中的属性名称，则可以使用计算属性表示法来执行此操作（从ES2015开始的新版本，但是，您使用的其他许多内容也是如此，所以...），请注意[]：

export default {
    [actionTypes.SELECT_HOST]: selectHost
};

例如，如果actionTypes.SELECT_HOST包含字符串"foo"，则会产生一个对象，其中包含名为foo的属性，其值为selectHost。

Answer 2

Inside Object literal，键名不能包含点（。）

＆＃34; SyntaxError：意外的令牌，预期，＆＃34;当试图访问javascript对象值

2 个答案: