Vue.js 中 computed 计算属性：不可修改，但可通过 data 属性更新

在 Vue.js 中，computed 属性是根据已有的数据进行计算得到的结果，它们是只读的，不应该被修改。computed 属性是通过依赖追踪来自动更新的，只要依赖的数据发生变化，计算属性就会重新计算。

如果你想要修改 computed 属性的内容，你应该使用 data 属性来存储可修改的值，然后使用 computed 属性来根据这个可修改的值计算出结果。当可修改的值发生变化时，computed 属性会自动重新计算。

下面是一个示例：

<template>
  <div>
    <p>原始值: {{ originalValue }}</p>
    <p>计算属性: {{ computedValue }}</p>
    <button @click="updateValue">更新值</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      originalValue: 10,
      modifiedValue: 20
    };
  },
  computed: {
    computedValue() {
      return this.originalValue * 2;
    }
  },
  methods: {
    updateValue() {
      this.originalValue = this.modifiedValue;
    }
  }
};
</script>

在这个示例中，原始值是可修改的，计算属性根据原始值进行计算。当点击'更新值'按钮时，原始值会被修改为 modifiedValue，然后计算属性会自动重新计算。