Vue2中使用组合式API

vue2.7的组合式api已经快要实现了,现在简单说一下在vue2.6x里面怎么使用组合式api,感兴趣可以体验一下。

实现步骤

1.初始化vue2的项目

vue create vue2-setup-demo

2.安装插件

yarn add @vue/composition-api

3.注册插件

// main.js中
import Vue from 'vue'
import VueCompositionAPI from '@vue/composition-api'

Vue.use(VueCompositionAPI)

在代码里面使用组合式api

<template>
  <div id="app">
    {{msg}}
  </div>
</template>

<script>
  import { ref } from '@vue/composition-api'
  export default {
    setup(){
      const msg= ref('hello')
      return {
        message
      }
    }
  }
</script>

其余用法与vue3中基本一样,可以体验一下。