vue 3 Memo

Vue 3 Memo是Vue.js 3中的一个新特性，它用于优化组件的性能。Memo可以将一个计算属性的结果进行缓存，只有在依赖项发生变化时才重新计算。这样可以避免不必要的计算，提高组件的渲染效率。

在Vue 3中，我们可以使用`vue`函数的`memo`方法来创建一个Memo。`memo`方法接收两个参数：一个函数和一个依赖项数组。函数是需要进行缓存的计算属性，依赖项数组是该计算属性所依赖的响应式数据。

下面是一个使用Vue 3 Memo的示例：

import { vue } from 'vue';

const MyComponent = vue({
  setup() {
    const count = vue.ref(0);

    const doubleCount = vue.memo(() => {
      console.log('Calculating doubleCount...');
      return count.value * 2;
    }, [count]);

    return {
      count,
      doubleCount,
    };
  },
});

在上面的示例中，我们定义了一个响应式数据`count`和一个Memo`doubleCount`。`doubleCount`的计算函数会在`count`发生变化时重新计算，否则会从缓存中获取结果。

使用Memo可以有效地减少不必要的计算，提高组件的性能。但需要注意的是，Memo只能用于纯函数式的计算，不应该在其中进行副作用操作。