javascript - 我无法将 json 字符串转换为 Vue.js 和 javascript 中的对象

Question

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

Uncaught SyntaxError: Unexpected end of JSON input

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: ['${', '}']
  });

Answer 1

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

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