我无法在 Vue.js 和 javascript 中将 json 字符串转换为对象答案

【问题标题】：I can't convert json string to object in Vue.js and javascript我无法在 Vue.js 和 javascript 中将 json 字符串转换为对象
【发布时间】：2017-07-30 17:31:06
【问题描述】：

我试图将此 json 字符串转换为对象，但我不能，控制台出现此错误：

未捕获的 SyntaxError：JSON 输入意外结束

at JSON.parse (<anonymous>)
at Vue$3.buildResults (rolList.js:422)
at Vue$3.boundFn [as buildResults] (vue.js:141)
at Vue$3.mounted (rolList.js:418)
at callHook (vue.js:2768)
at Vue$3.Vue._mount (vue.js:2630)
at Vue$3.$mount (vue.js:6186)
at Vue$3.$mount (vue.js:8557)
at Vue$3.Vue._init (vue.js:3389)
at new Vue$3 (vue.js:3437)

The json string is this:

{"modulos":{"1":{"name":" Usuarios","paginas":{"1":{"name":" Listado Usuarios","facultades":{"1":{"name":" ver"}}}}}}}

java脚本代码是这样的：

  resultsLi = new Vue({
    el: '#result-list',
    data: {
      resultls: "",
      json: []
    },
    mounted: function () {
      this.buildResults();
    },
    methods: {
      buildResults: function(event) {
        this.json = JSON.parse(this.resultls);
        console.log(this.resultls);

      }
    },
    watch: {
      resultls: function(val, oldVal){
        this.buildResults();
      }
    },
    delimiters: ['${', '}']
  });

【问题讨论】：

您确定它是 JSON 字符串而不是对象吗？ this 是您认为应该在 buildResults 定义中的内容吗？你应该改用this.data.resultls 吗？如果this 应该是您的resultsLi，那么this.resultls 和this.json 都是undefined，因为它们是data 属性的子级。
我已经使用以下代码转换了 json 对象：coderesultsLi.resultls = JSON.stringify(tempList); code 因为只有当我将 json 转换为 json 字符串时，当我添加元素时，vue whatcher 才检测到对象的变化
只要在调用JSON.parse()之前就行console.log(typeof this.results)，如果结果是'object'，那么你不需要调用JSON.parse()
我看到 vue.js 代理了 data 对象，所以 this.resultls 可以工作。那么我剩下的问题是它的价值是否是你认为的那样。
你发布的json字符串已经是一个对象

标签： javascript json object vue.js

【解决方案1】：

您收到该错误是因为在初始加载时，您的 resultls 是一个空字符串。您可以将其更改为一揽子空 json，以便它可以正确解析并在手表中更新。

resultsLi = new Vue({
  el: '#result-list',
  data: {
    resultls: "{}",
    json: []
  },
  mounted: function () {
   .....
}

【讨论】：

谢谢！这对我有帮助。我把它命名为resultls=null，并且拉了几个小时的头发。一旦我将其设置为“{}”，事情就开始起作用了。