vue 对象转json

// 示例代码：将 Vue 实例中的对象转换为 JSON

// 创建一个 Vue 实例
new Vue({
  el: '#app',
  data: {
    user: {
      name: 'John Doe',
      age: 30,
      address: {
        city: 'New York',
        zip: '10001'
      }
    }
  },
  methods: {
    // 将 user 对象转换为 JSON 字符串
    convertToJson() {
      const jsonString = JSON.stringify(this.user, null, 2);
      console.log(jsonString);
      return jsonString;
    }
  }
});

// HTML 部分
<div id="app">
  <button @click="convertToJson">Convert to JSON</button>
  <pre>{{ convertToJson() }}</pre>
</div>

解释说明：

1. Vue 实例：我们创建了一个 Vue 实例，其中 data 包含一个名为 user 的对象。
2. convertToJson 方法：该方法使用 JSON.stringify 将 user 对象转换为 JSON 字符串，并通过 console.log 输出到控制台。同时，返回该 JSON 字符串。
3. HTML 部分：包含一个按钮，点击按钮时会调用 convertToJson 方法，将 user 对象转换为 JSON 并显示在页面上。

如果你需要更复杂的处理（例如处理循环引用或特定格式），可以进一步扩展此代码。