无法使用导入的json将对象转换为原始值

时间:2019-01-19 16:42:45

标签: javascript json vue.js vuetify.js nuxt.js

enter image description here

我正在尝试通过导入和遍历模块(Using different text values with vuetify component)中的json在nuxt项目(https://hackernoon.com/import-json-into-typescript-8d465beded79)中动态构建vuetify组件。

/static/info.json中的json是:

{
  "id": 1,
  "name": "Johnson, Smith, and Jones Co.",
  "amount": 345.33,
  "Remark": "Pays on time"
}

在我的Vue组件中,我有:

  import * as data from '../static/info.json';

  const word = data.name;

  console.log(word); // output 'testing'
  console.log(data); // output 'testing'
  var jsonData = JSON.parse(data);
  // console.log(jsonData); // output 'testing'

该行:

  var jsonData = JSON.parse(data);

原因:

 Cannot convert object to primitive value 

如何遍历导入的json?

1 个答案:

答案 0 :(得分:4)

我猜数据已经是一个对象,不需要再次解析。导入已将其变成对象。您已经将它与data.name一起使用