"message" @input="updateMessage">
  
computed: {
  message() {
    return this.msg + '%';
  }
},
methods: {
  updateMessage (e) {
    this.msg = e.target.value;
  }
}

"message">

computed: {
  message: {
    get () {
      return this.msg + '%';
    },
    set (value) {
      this.msg = value;
    }
  }
}

<div class="select-all">
    <input type="checkbox" id="fb" :checked="allCheck" @change="setAllCheck">
    <label for="fb">全选label>
div>

1、 vue .js的 com put ed 方法： 处理复杂逻辑，基于依赖缓存，当依赖发生改变时会重新取值。用methods也可以实现同样的效果，但methods在重新渲染的时候会重新调用执行，在性能上 com put ed 优于methods,当不需要缓存时可用methods。 实例1： com put ed 和methods实现翻转字符串 <template> <input v- model ="message"> <p>原始字符串: {{ message }}</p> <p>计算后反转字符串: {{ revers ed Message }}</p> <p> 使用 方法后反转字符串: {{ revers

面试过程中被问到 一个 问题 就是 v- model 上面 绑定 com put ed 可以实现数据双向 绑定 吗？我的第一反应是可以。但是后来实际操作了一下，发现是不可以实现双向数据 绑定 的。下面我贴一下代码 大家看下。 可以看到 他是可以 绑定 上去的 但是如果你改变input中的值 他就会报错 no set ter。 代码是这么写的： 如果在 com put ed 的方法里写上get()和 set ()方法的话 就不会报错了 但是 没办法实现数据双向 绑定 的效果。 总结：如果你把计算 属性 绑定 在v- model 上的话 可以展示数据 但是如果

https://www.bilibili. com /video/BV1hb411K7Ud?p=6 1.计算 属性 com put ed 基础用法：实现单向 绑定 <div id='app'> 姓<input placeholder="First Name" v- model ='firstName'><br/> 名<input placeholder="Last Name" v- model ='lastName'><br/> <!-- 1.计算 属性 的

### 回答1： 计算 属性 com put ed 是 Vue .js框架中的 一个 特性，它用于根据已有的数据计算出新的 属性 。计算 属性 的特点是将数据的计算逻辑封装起来，以便在模板中直接引用，并且只有在依赖的数据发生变化时，才会重新计算。 1. 计算 属性 是通过在 Vue 实例的 com put ed 选项中定义的。 2. 计算 属性 的值不需要在数据选项中显示定义，它是根据依赖的数据动态计算得到的。 3. 计算 属性 会缓存计算结果，在依赖的数据没有发生变化时，会直接返回之前的计算结果，避免重复计算浪费性能。 4. 计算 属性 可以依赖其他计算 属性 ，这是因为计算 属性 本身也是响应式的，会根据它所依赖的数据进行更新。 5. 计算 属性 可以通过 set ter函数来实现双向 绑定 ，当计算 属性 的值发生变化时，可以触发指定的方法，并且可以修改其他相关的数据。 综上所述，计算 属性 是 Vue .js中一种用于根据已有的数据计算出新的 属性 的特性，它的特点包括定义在 com put ed 选项中、动态计算、缓存结果、可以依赖其他计算 属性 、支持双向 绑定 等。 ### 回答2： 计算 属性 ( com put ed )是 Vue .js中的 一个 特性，用于对数据进行计算并返回 一个 新的衍生值。它的描述可以从以下几个方面来说明： 首先，计算 属性 是通过在 Vue 实例中定义 一个 函数来实现的。这个函数会被自动调用，并且会在计算 属性 所依赖的数据发生变化时自动更新。这意味着，只要依赖的数据发生变化，计算 属性 就会重新计算并返回新的值。 其次，计算 属性 可以依赖于其他的计算 属性 。这意味着我们可以在计算 属性 中 使用 其他的计算 属性 来进行进一步的计算。这种依赖关系会自动建立，并且在任何 一个 计算 属性 发生变化时，所有依赖它的计算 属性 都会被重新计算。 此外，计算 属性 是具有缓存机制的。这意味着计算 属性 的值会被缓存起来，在下一次访问时直接返回缓存的值，而不会重新计算。只有当计算 属性 所依赖的数据发生变化时，才会重新计算并更新缓存。这样可以有效地提高性能，避免不必要的计算。 总结起来，计算 属性 是用于对数据进行计算并返回 一个 新的衍生值的特性。它可以依赖于其他的计算 属性 ，并具有缓存机制，以提高性能。也正因为这些特性，计算 属性 在 Vue .js中被广泛应用于对数据的处理和衍生值的计算。 ### 回答3： 计算 属性 com put ed 是 Vue .js框架提供的一种 属性 ，用于在 Vue 实例中进行数据计算和派生。它的 一个 重要特点就是计算 属性 会根据它所依赖的数据进行缓存，并在依赖数据发生变化时重新计算。 首先，计算 属性 需要定义在 Vue 实例中的 com put ed 选项中，并且可以被当做普通 属性 来访问和 使用 。计算 属性 的值是通过计算函数来返回的，计算函数可以 使用 Vue 实例中的其他 属性 或方法，也可以 使用 其他计算 属性 。 其次，计算 属性 会在其依赖的数据发生变化时自动重新计算，而不需要手动调用。 Vue 会自动跟踪计算 属性 的依赖关系，并在依赖变化时触发计算 属性 的重新计算。 另外，计算 属性 是基于它的依赖进行缓存的。也就是说，计算 属性 只在它的依赖发生变化时才会重新计算，而在依赖没有变化时，计算 属性 会直接返回之前缓存的结果。这样可以提高性能，避免不必要的计算。 最后，计算 属性 还可以 使用 get和 set 方法，也就是可以定义 一个 计算 属性 的 set ter。这样就可以实现计算 属性 的双向 绑定 ，即在模板中 使用 计算 属性 的时候可以像 使用 普通 属性 一样进行赋值操作。 综上所述，计算 属性 com put ed 是 Vue .js中一种方便实用的 属性 ，可以根据依赖数据进行计算和派生，并且具有缓存和自动重新计算的特性，可以提高性能并简化代码。