vue 各种小知识-----1

本文探讨了Vue.js的多个方面,包括保留HTML注释的方法、key的原理、Vue不同版本的区别、data重置技巧、Vue.observable的作用、style scoped的用途与原理、Vue 3.0的期待功能以及Vue的边界情况处理,还介绍了在Vue项目中配置favicon的注意事项。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

1 vue渲染模板时怎么保留模板中的HTML注释呢?

 <template comments> ... <template>
 // 设置注释属性,官网默认为舍弃注释
  <script>
   import ... export default {comments:true,...}
  </script>

2 你知道vue中key的原理吗?说说你对它的理解

  1. 作用的话,便于diff算法的更新, key的唯一性,能让算法更快的找到需要更新的dom,
    需要注意的是,key要唯一,不然会出现很隐蔽性的更新问题。

3 你是从vue哪个版本开始用的?你知道1.x和2.x有什么区别吗?

1、 2.0生命生命周期变化感觉变得更加语义化一点(有规律可寻,更好记了),而且增加了beforeUpdate、updated、activated、deactivated,删除了attached、detached。
2、2.0将1.0所有自带的过滤器都删除了,也就是说,在2.0中,要使用过滤器,则需要我们自己编写,以下是一个自定义过滤器示例, Vue.filter(‘toDou’,function(n,a,b){ return n<10?n+a+b:’’+n; });

4 vue中怎么重置data?

使用Object.assign(),vm. d a t a 可 以 获 取 当 前 状 态 下 的 d a t a , v m . data可以获取当前状态下的data,vm. datadatavm.options.data可以获取到组件初始化状态下的data,具体可以看vm.$options。

Object.assign(this.$data, this.$options.data())

5 Vue.observable你有了解过吗?说说看

  1. 类轻量级vuex,用作状态管理。
  2. vue2.6发布一个新的API,可以处理一些简单的跨组件共享数据状态的问题。
//store.js
import Vue from 'vue';

 export let store =Vue.observable({count:0,name:'张三'});
    export let mutations={
	    setCount(count){
		    store.count=count;
	    },
	    setName(name){
	  	  store.name=name;
    }
}

6 你知道style加scoped属性的用途和原理吗?

1 在标签上绑定了自定义属性,防止css全局污染 但是很多时候使用ui框架如果加scope就不能覆盖,这个时候一般写sass
会在最外层包裹该组件名的id 就可以不使用scoped 了

2 用途:防止全局同名CSS污染
原理:在标签加上v-data-something属性,再在选择器时加上对应[v-data-something],即CSS带属性选择器,以此完成类似作用域的选择方式

7 你期待vue3.0有什么功能或者改进的地方?

  1. ts支持,更易用,源码更易读,期待ing,
  2. 用尤大的话说就是各种速度提升n倍。我希望在依赖node_modules能够做出调整,文件数目太多,开启项目每次都要下载
  3. 彻底解决Vuex表单状态管理问题 双向数据绑定用的proxy,插槽也换成了函数的方式

8 vue边界情况有哪些?

  1. 组件递归 组件之间相互引用,A用B,B又用了A
  2. 在errorCaptured中更改组件状态,触发更新后再次报错(未设置短路条件),陷入无限循环

9 在vue项目中如何配置favicon?

在这里插入图片描述
![在这里插入图片描述](https://img-blog.csdnimg.cn/20190730103447896.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2lDcmF6eVRpbW9y,size_16,color_FFFFFF,t_70在这里插入图片描述
在这里插入图片描述
注意:配置favicon图标的路径是相对路径!!!
修改配置文件后需重启npm run dev
打包后根目录下就会有favicon.ico

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值