从 map 函数返回对象时出现意外的标记错误 - reactjs

Question

我正在尝试 return 来自 map 对象数组的 dictionary/object 函数。

但是得到Unexpected token，我已经绑定追踪了，谁能帮忙，我错在什么地方？

我的代码示例是


class App extends Component {


  render() {

    let a = [
    {
      "a": 123,
      "b": "99",
    }, {
      "a": 333,
      "b": "33",
    }
  ];

  a.map((value, key) => {
    return {`${key-text}`: value["a"]};
  });

    return (
      <div className="App">
        <header className="App-header">
          <img src={logo} className="App-logo" alt="logo" />
          <p>
            Edit <code>src/App.js</code> and save to reload.
          </p>
          <a
            className="App-link"
            href="https://reactjs.org"
            target="_blank"
            rel="noopener noreferrer"
          >
            Learn React
          </a>
        </header>
      </div>
    );
  }
}

在上面的代码中，第 return {${key-text}: value["a"]}; 行显示了意外的令牌，这里有什么问题？

Answer 1

故障在

a.map((value, key) => {
    return {`${key-text}`: value["a"]};
});

替换为

a.map((value, index) => {
    return {`${index}`: value["a"]};
});

此处索引是数组中对象的引用

Answer 2

在您的地图函数中，key-text 实际上是在寻找一个名为 key-text 的变量，该变量不存在，因此会出现错误。如果您尝试将 text 插入到 key，将其更改为这样应该可以工作

a.map((value, key) => {
  return {[`${key}-text`]: value["a"]};
});

希望对您有所帮助。

Answer 3

您需要一个父对象来创建动态键。

let a = [
    {
      "a": 123,
      "b": "99",
    }, {
      "a": 333,
      "b": "33",
    }
  ];

  a.map((value, key) => {
    let x = {};
    x[key+"-text"] = value["a"];
    console.log(x);
    return x;
  });

Answer 4

这里你使用了text作为变量但没有定义它。所以你必须在地图上方定义一个 text 变量。

Like

  const text = 0; // or whatever number you want.
  a.map((value, key) => {
    return {`${key-text}`: value["a"]};
  });

OR

您可以将 text 用作 string

Like

  a.map((value, key) => {
    return {`${key}-text}`: value["a"]};
  });

两者都试一下，保留最适合你的。

从 map 函数返回对象时出现意外的标记错误 - reactjs

Unexpected token error on returning an object from map function - reactjs

reactjs

react-native

react-redux

react-native-android