Vue中的知识点

1.vue中for的key有什么用?

         Key是给虚拟DOM加的一个标识,当数据发生变化时,vue会去根据【新数据】去生成【新的虚拟DOM】。随后会将【新的虚拟dom】与【旧的虚拟dom】进行对比。对比时的依据就是这个key.

   不用key,获取用index当key都有可能出现问题。如果只是展示修改可以。但是建议还是使用唯一标识例如uuid,手机号,身份证,等等。

2.什么是虚拟DOM有什么用?

         vue为了提高页面渲染效率,只渲染更改的dom,在内存中会有一个虚拟的dom,他会与之前的虚拟进行比较。比较的依据就是key。

3.vue中的数据代理是什么? 数据劫持=数据代理

   在元素js中实现响应式,

        var n=10;    
		var obj1={name:"php"};//定义一个对象
		//给对象添加一个新属性
		Object.defineProperty(obj1,"age",{
		   get(){return n;},
		   set(v){
		        n=v; 
				console.log("set")
				//只要有人修改age 我就更新dom
				document.getElementsByTagName("div")[0].innerHTML=n;
		   }
		})
	   //第一次加载
       document.getElementsByTagName("div")[0].innerHTML=n;
	   //打开f12控制台,修改obj1.age=25;发现界面也会跟着变化 
	   //这就是js数据代理,vue也是利用Object.defineProperty()

vue中的数据代理

 vue的实例对象vm拿到data中的数据后会放到_data中,这个_data中就使用Object.defineProperty封装了所有数据的getter与setter,只要有人修改数据setter就会执行,一执行外层的数据就修改,界面就会变化。意思就是vue把自身的data给了_data进行代理

4.router路由的两种工作模式?

        hash模式:路径带#号不美观,但是兼容性好,适合后端系统。

        history模式:不带#号,好看,但需要后端人员支持解决。

5.浏览器历史记录

       <RouterLink replace .......>News</RouterLink>

      replace不记录,hash有记录

6.v-model的原理

       给一个原始html元素写v-model双向绑定其实 他是

      <input     :value="name"     @input="$event.target.value"/>这样实现的双向绑定

      给组件就是 传递的就是modelValue和事件update:modelValue

7.组件之间的传值

7.1.props(父->子,子->父)父在写子组件时通过:car="benchi" 给子,这可以是属性或者方法,子通过defineProps(['car','getToy'])去接受调用方法进行传递

7.2.自定义事件(子->父):父组件<son @setFatherName=“updatename2”>子组件const emit = defineEmits(["setFatherName"]);去emit.setFatherName(666);去执行。

7.3.$attrs(祖->孙)其实就是props方式,只是中间的父亲v-bind="$attrs"

7.4.mitt (任何组件通讯) 类似消息订阅发布,

emitter.on('send-toy',(value)=>{ console.log('send-toy事件被触发',value) })绑定事件

emitter.emit('send-toy',toy.value)执行事件

相关推荐

  1. Vue知识

    2024-03-14 14:40:05       24 阅读
  2. vue知识

    2024-03-14 14:40:05       42 阅读
  3. Linux知识

    2024-03-14 14:40:05       34 阅读
  4. 总结工作vue2和vue3知识区别

    2024-03-14 14:40:05       22 阅读
  5. vue3使用和知识

    2024-03-14 14:40:05       38 阅读
  6. 详细分析Vue3卡槽知识(附Demo)

    2024-03-14 14:40:05       10 阅读
  7. VUE知识

    2024-03-14 14:40:05       50 阅读
  8. vue知识杂记

    2024-03-14 14:40:05       20 阅读
  9. Vue知识

    2024-03-14 14:40:05       21 阅读

最近更新

  1. TCP协议是安全的吗?

    2024-03-14 14:40:05       18 阅读
  2. 阿里云服务器执行yum,一直下载docker-ce-stable失败

    2024-03-14 14:40:05       19 阅读
  3. 【Python教程】压缩PDF文件大小

    2024-03-14 14:40:05       18 阅读
  4. 通过文章id递归查询所有评论(xml)

    2024-03-14 14:40:05       20 阅读

热门阅读

  1. CXL (Compute Express Link) Technology——论文阅读

    2024-03-14 14:40:05       37 阅读
  2. c++面经

    2024-03-14 14:40:05       19 阅读
  3. 人类的谋算与量子计算

    2024-03-14 14:40:05       15 阅读
  4. 用C语言链表实现图书管理

    2024-03-14 14:40:05       18 阅读
  5. 算法刷题day30:递归

    2024-03-14 14:40:05       23 阅读
  6. Dijkstra&floyed

    2024-03-14 14:40:05       20 阅读
  7. 3. Linux标准I/O库

    2024-03-14 14:40:05       18 阅读
  8. Linux 学习笔记(15)

    2024-03-14 14:40:05       20 阅读
  9. vue常用6种数据加密方式的使用

    2024-03-14 14:40:05       17 阅读
  10. Python 正则表达式

    2024-03-14 14:40:05       21 阅读
  11. C++ 智能指针

    2024-03-14 14:40:05       16 阅读