使用vue3+ts+vuex+axios 撸了一个官网
2020-12-12 本文已影响0人
涵子_


确定你的电脑有木有vue的环境~vue create "your project"

Manually select features~手动选择功能安装


Use class-style component syntax 我选择的no,如果安装的话可以 class的模式写vue组件,有兴趣的同学可以安装看看。
Use history mode for router? 我选择的hash
其余的可以按照我的选择

这边是带领大家走了一个安装流程。其实 可以直接copy 项目地址就可以看了
https://github.com/shuyuhan01/vue-test
接下来就简单说下vue3的项目和vue2项目的区别
1.main.ts 中需要从vue import createApp在通过.use的形式 注册路由以及store到 app
2.新增了ref定义初始化数据,去掉methos,多了setup的方法 相关逻辑都写在里面
3.setup 接受props, context,两个参数,像父子间通讯可以用到
4.所定义的实践方法,可以通过函数声明的写法,还需要在return 里面写入,不然会报错
5.还有一些watch computer 生命周期 等写法 都有改变
你们可以看看文档多练习下,有兴趣还可以去看看源代码,详细的api可以看composition-api
https://composition-api.vuejs.org/zh/api.html#setup
最后项目打包到测试环境 遇到一个问题https://segmentfault.com/q/1010000038182104
到现在还没解决