vue2版本中使用compositionAPI
vue2的optionsAPI与vue3的compositionAPI孰优孰劣就不再赘述了,萝卜青菜各有所爱,小孩才做选择,大人当然是全都要,vue3中依然可以使用optionsAPI,vue2中也可以使用compositionAPI首先是从npm或者yarn上下载@vue/composition-api这个包npm install @vue/composition-api# oryarn add
·
PS:2022,7月更新–最新的2.7版本已支持compositionAPI,不用再单独引入,写下面文章时2.7版本还未发布
vue2的optionsAPI与vue3的compositionAPI孰优孰劣就不再赘述了,萝卜青菜各有所爱,小孩才做选择,大人当然是全都要,vue3中依然可以使用optionsAPI,vue2中也可以使用compositionAPI
首先是从npm或者yarn上下载@vue/composition-api这个包
npm install @vue/composition-api
# or
yarn add @vue/composition-api
然后在main.js/main.ts里通过Vue.use()安装
import Vue from 'vue'
import VueCompositionAPI from '@vue/composition-api'
Vue.use(VueCompositionAPI)
紧接着就可以在项目中尽情享用3的特性了,有遗憾的是还不能在script标签后面直接使用setup语法糖(补充:2.7版本已支持)
<template>
<div>
{{msg}}
<ul v-for="item in look">
<li>{{item}}</li>
</ul>
</div>
</template>
<script>
import {ref, reactive} from '@vue/composition-api'
export default {
name: 'Vue2CompositionAPI',
setup() {
const msg = ref('hello vue')
const obj = {
name: 'vue2',
version: '2.6.x',
title: 'optionsAPI'
}
const look = reactive({...obj})
return {msg, look}
}
}
</script>
更多推荐
已为社区贡献1条内容
所有评论(0)