Vue Composition API 初探
Composition API是 vue-next 中的逻辑复用解决方案，它是一组基于函数式编程的组合式 API。与之前的逻辑复用方案mixin相比，带来了更友好的类型检查，更方便的测试等优点。 Composition API的详细用法和 API 可以参考官方文档，这里我们做一个简单的初步的上手体验。 安装 Composition API被单独抽离为一个库，让我们可以在 vue2.x 中体验该特性。 npm install @vue/composition-api # or yarn add @vue/composition-api 在Vue中注册@vue/composition-api // main.js import Vue from 'vue' import CompositionApi from '@vue/composition-api' Vue.use(CompositionApi) 得益于 vue 的插件机制，通过一行简单的代码，我们就给项目添加了Composition API特性。 开始 Composition API给 vue 组件增加了一个名为setup的生命周期函数，它要早于befororeCreate执行，在 vue-next 中是最早执行的生命周期钩子。 注意: 和befororeCreate一样，setup实例还没创建，因此无法使用this。 <template> <!-- 自动展开 --> <div>{{message}}<div> <!-- 也可以手动取值 --> <div>{{message.value}}</div> </template> <script> import { ref } from '@vue/composition-api' export default { setup () { const message = ref('hello vue') return { message, setMessage: (msg) => initialMessage....