出示一个vue2.x版本的compute使用示例

在Vue 2.x中，`computed`属性是一种响应式的数据计算功能，它允许你在组件内部定义基于其他数据属性的计算结果。当你依赖的数据发生变化时，`computed`会自动更新其值。

下面是一个简单的Vue 2.x组件中使用`computed`的示例：

<template>
  <div>
    <input v-model="message" placeholder="Type something">
    <p>Computed message length: {{ computedMessageLength }}</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      message: '',
    };
  },
  computed: {
    // 使用 computed 将 message 的长度作为新的属性
    computedMessageLength() {
      return this.message.length;
    }
  }
};
</script>

在这个例子中，用户输入框(`v-model`)绑定了`message`数据。当用户输入时，`message`的值会改变。由于我们还定义了一个`computedMessageLength`计算属性，它会实时反映`message`的长度。所以，`{{ computedMessageLength }}`这部分的内容会随着输入内容的变化而动态更新。