组件保持存活/异步组件/依赖注入/Vue应用
1.组件保持存活
正常组件用按钮切换后被切换的组件会被销毁重建,而KeepAlive标签可以保持被切换的组件不被销毁
例如:数据一被切换为新数据,切换组件后再切换回来还是新数据,若未用KeepAlive标签,切换组件后再切换回来还是数据一
2.异步组件
同步:有多个功能A/B/C时,功能运行是先运行A再运行B这种操作 异步:有多个功能A/B/C,可同时运行A/B/C
异步组件优化项目功能 大型项目时,我们可能需要拆分应用为更小的块,并仅在需要时再从服务器加载相关组件
defineAsyncComponent方法实现项目在需要时再运行
3.依赖注入
通常情况下 子页面想要主页面的数据信息,需要父页面用props接收主页面的数据信息再传给子页面,但当子页面层级过多时,此方法比较麻烦。因而出现了provide和inject来解决这一问题
主页面结构:
传递静态数据方法
provide:{
message:"主页面直接给的数据"
}
或
传递动态数据方法
provide(){
return{
msg:this.msg,
message:"主页面直接给的数据"
}
}
接收页面结构:inject:["message"]
全局数据
任意界面都可接收
4.Vue应用