Vue3和Typescript的项目经验总结

前言：包括三个项目，做的总结。

HTML：

img图片一定要设置宽高，把它当div看待

---

CSS：

如果不想定义元素的宽高，可以试着去撑开，比如内边距，字体大小

---

Typescript：

声明一个types的文件夹，里面专门写ts约束，然后导出，页面需要就导入。

枚举常用来表示状态

函数的参数必须声明好，不能用any

内部数据可以用any

---

Vue3：

可以在ts里面声明一个类，在页面的响应式数据中new 这个类，生成类的响应式对象，那我们一户直接改ts里面的类就好了。

类的属性约束同样是定义接口进行约束

前提使用同一个子组件，组件内同一个位置使用不同的功能建议使用插槽

路由：

前题都需要进行导入路由 

路由实例：

在页面引入useRouter路由，在setup里面定义常量 const router =  useRouter（）

在页面上可以通过路由实例拿到路由的所有信息。router.getRoutes()

---

当前页面路由对象： 

const route = useRoute()

const query = route.query

---

 动态路由：

获取路由列表：gerRoutes（），

添加路由信息：addRoute（）

---

 

路由拦截： 

就是那些玩意

---

部署：