ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

Vue3—07—动态组件;keeplive;生命周期;mixin

2021-09-20 13:03:17  阅读:206  来源: 互联网

标签:07 标签 js 分包 mixin Vue3 组件 keeplive ref



 

一、动态组件

所谓的动态组件应该和keeplive一样,都是vue的内置组件;

 

component标签的is属性可以写哪些东西? 

  • 第一,全局组件,比如通过vue.createApp().component()函数注册过的全局组件;
  • 第二,在本组件实例中注册的局部组件,即在本组件实例的component属性注册的组件;

 

 

 

 

 

二、keeplive

 

 

 建议直接用逗号分隔,也就是第一种方式,后面的正则和数组都太麻烦了,而且还要加冒号:让vue知道去管理它,它不是一个字符串;

 

 

三、webpack代码分包和异步组件

打包之后会有两个文件,app.js 是我们自己写得js逻辑,  chunk-vendor是我们依赖的第三方js;

后面我们开始分包后,会有一个chunk.js文件,这个就是我们分包的js逻辑;

webpack对代码的分包主要是通过import().then();的方式指定这份代码要分包,即不是需要立即加载;

 

 2.异步组件

 

 

 

 

 

 

 

 

四、¥ref、¥parent、¥root

我们可以给html标签或者组件标签,添加一个属性¥ref,

然后我们就可以在任意组件逻辑中,通过this.$ref去获取这些元素标签或者组件标签了;

也就是说,这样我们就可以去操作dom元素了;

 

 所以这是一个很强的属性,但是有时候我们不会用,还是用props或者emit等进行组件的通信,原因就是¥ref和¥parent¥root可能会导致组件间的耦合性太强,代码太乱不好管理等;

 

 

 

 

 

 

 

 

 

 

 

五、生命周期

 

 

 

标签:07,标签,js,分包,mixin,Vue3,组件,keeplive,ref
来源: https://www.cnblogs.com/EricShen/p/15314087.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有