Vue2使用setup、ref、reactive等Vue3的组合式@vue/composition-api、vuex-composition-helpers

有些同学想在当前项目中体验Vue3组合式api,setup、ref、reactive等,而且一步就可以升级到Vue3,但是vue确实2.x版本,不改变当前版本怎么办呢?
vue2.7.0开始自带composition-api可以放心体验,不支持

从第三步,我们看到有些不一样

1、setup中 上下文参数 context 

1.1、this 的替代,root 这里面是vue组件的实例,可以获取到很多属性和方法,如 root.$storeroots.$message

1.2、refs 可以获取子组件的对象,从而获取子组件的 数据和方法

2、setup 外,可以使用 components computed 正常使用

2.1、components 注册子组件

2.2、computed 属性依赖计算,导入 mapGetters,由于Vuex3.x不支持 useStore 等Api

由此导致的问题,解决方案

  1、方法一:简单粗暴、在 setup 中 使用 root , 可以获取 store 中的所有 方法和 属性

  2、方法二:优雅、安装插件  vuex-composition-helpers 

npm install vuex-composition-helpers
// 或
yarn add vuex-composition-helpers

另外,如果想提样

你可能感兴趣的:(vue.js,javascript,ecmascript,前端,前端框架)