zoukankan      html  css  js  c++  java
  • Vue Hooks

    Vue Hooks Api 

      1. setup()方法是 Vue3.0 中引入的一个新的组件选项,setup 组件逻辑的地方。setup 是在组件实例被创建时, 初始化了 props 之后调用,处于 created 前。也就是beforeCreate之后created之前进行的初始化。 我们从上面的所有例子能发现,setup() 和 data() 很像,都可以返回一个对象,而这个对象上的属性则会直接暴露给模板渲染上下文

                 

      2. reactive()方法可以理解为vue2中的data,传入一个对象通过observe方法让传入的对象变成双向绑定的数据。 ref()方法和reactive方法差不多,不过ref定义的属性只能是基本数据类型。本来我认为也是通过observe方法进行的处理,我百度了一下发现基本数据类型是通过一个方法进行的Proxy代理,这也是为什么ref生成的数据进行修改时要进行.value操作,引用数据类型是通过reactive这个方法进行的处理。

       3. toRef()是将个对象 A 中的某个属性 x 转换为响应式数据,其接收两个参数,第一个参数为对象 A,第二个参数为对象中的某个属性名 x。 ref()和toRef()的区别: 参数不同:ref()接收一个 js 基本数据类型的参数;toRef()接收两个参数,第一个为对象,第二个为对象中的某个属性; 原理不同:ref()是对原数据的一个深拷贝,当其值改变时不会影响到原始值;toRef()是对原数据的一个引用,当值改变时会影响到原始值; 响应性不同:ref()创建的数据会触发 vue 模版更新;toRef()创建的响应式数据并不会触发 vue 模版更新,所以toRef()的本质是引用,与原始数据有关联。

                 

    toRefs()接收一个对象作为参数,并遍历对象身上的所有属性,然后逐个调用toRef()执行。以此,将响应式对象转化为普通对象,便于在模版中可以直接使用属性。

              

  • 相关阅读:
    MyOD-Linux od命令的实现
    20175320 2018-2019-2 《Java程序设计》第9周学习总结
    MyCP-实现文件的复制以及进制转换
    20175320 2018-2019-2 《Java程序设计》第8周学习总结
    2018-2019-2 20175320实验二《Java面向对象程序设计》实验报告
    20175320 2018-2019-2 《Java程序设计》第7周学习总结
    类定义20175320
    20175320 2018-2019-2 《Java程序设计》第6周学习总结
    结对编程项目-四则运算阶段性总结
    算法复习周------递归之“合并排序”
  • 原文地址:https://www.cnblogs.com/7fls/p/15218997.html
Copyright © 2011-2022 走看看