第三十五篇:vue3,(组合式api的初步理解)
好家伙,
来一波核心概念:数据劫持是响应式的核心
1.由set up开始
(1)vue3中的一个新的配置项,值为一个函数.
(2)组件中所用的到的:数据,方法,计算属性均要配置在set up中.
(3)set up函数的两种返回值:1.若返回对象,则对象中的属性,方法可以在模板中直接使用,
2.返回函数(渲染函数)
注意:vue2和vue3的配置不要混用,set up不能访问到vue2的配置
2.ref函数
作用:定义一个响应式数据 (把你的数据封装成一个对象,放在value里,使用get和set实现响应式)
语法:JS中操作数据: XXX.value
全名:Refimpl Ref:reference 引用 impl:implement 实现
inport {ref} from 'vue'
set up(){
let name =ref('张三')
let job =ref({
type:'前端工程师',
salary:'30k'
})
}
return{
.......
}
所以:1.处理基本数据类型用的get.set完成的
2.处理对象类型数据中,就不是再套一层ref对象,而是用的Proxy代理对象(内部求助reactive函数)
3.reactive函数:
3.1.作用:定义一个对象类型的响应式数据(关键字:对象类型,基本类型还是用ref函数)(深层次,你套多少层都行)
3.2.语法:(接受一个对象,返回一个代理对象)
const 代理对象 = reactive(源对象)
3.3.reactive定义的响应式数据是深层次的
3.4.内部基于Proxy(不知道啥玩意,以后会学)对象实现,
就这么多了
强啊,尚硅谷
第三十五篇:vue3,(组合式api的初步理解)的更多相关文章
- Android UI开发第三十五篇——AppCompat实现Action Bar
每一位Android开发者对Action Bar这种设计都不陌生了,毕竟它已经发布了至少两年了.Android团队发布Action Bar设计规范时同时放出了ActionBar的Api来支持这种设计. ...
- 第三十九篇:Vue3 watch(ref和reactive的监视)
好家伙, 1.vue2中的watch是调用配置项,(只能写一个) vue3中的watch是一个函数(可以写很多个) 2.watch一些用法: 这里是定义的数据 set up(){ let sum =r ...
- Python之路(第三十五篇) 并发编程:操作系统的发展史、操作系统的作用
一.操作系统发展史 第一阶段:手工操作 —— 真空管和穿孔卡片 第一代之前人类是想用机械取代人力,第一代计算机的产生是计算机由机械时代进入电子时代的标志,从Babbage失败之后一直到第二次世界大 ...
- 第三十五篇-AppBarLayout的使用
效果图: 添加appbarlayout到xml文件中,然后在toolbar下面添加一个imageview并设置居中放置,我放置的是上面那个安卓的图标. 根据之前学过的toolbar那一节,结合view ...
- 第三十五篇 类的内置属性(attr属性),包装和授权,__getattr__
双下划线开头的attr方法,都是类内置的方法. 一. 如果没有在类里定义这三个方法,调用的时候就调用类内置的默认的方法 class Too: pass # 类没有定义这三个属性,就用系统默认的方法 t ...
- 第三十八篇:vue3路由
好家伙,水博客怎么说 1.0.安装:简简单单的淘宝镜像安装 装一下淘宝镜像(一般都有) npm install -g cnpm --registry=https://registry.npm.taob ...
- 第三十六篇:vue3响应式(关于Proxy代理对象,Reflect反射对象)
好家伙,这个有点难. 1.代理对象Proxy Proxy 对象用于创建一个对象的代理,从而实现基本操作的拦截和自定义(如属性查找.赋值.枚举.函数调用等). 拦截对象中任意属性的变化,包括:查get, ...
- 第三十五篇 入门机器学习——Juptyer Notebook中的常用快捷键
1.运行当前Cell:Ctrl + Enter 2.运行当前Cell并在其下方插入一个新的Cell:Alt + Enter 3.运行当前Cell并选中其下方的Cell:Shift + ...
- C++第三十五篇 -- 写第一个驱动开发程序
VS2017+WDK+VMware12+Win10环境配置完毕,接下来写第一个驱动程序. 1.新建一个KMDF的程序. 2.配置项目属性. 3.编译项目.一般这里应该成功,我一台电脑成功了,另一台电脑 ...
随机推荐
- 我给航母做3D还原:这三处细节,太震撼了…
前两天,我国第三艘航母正式下水,受到国际舆论高度关注.国产福建舰火出了圈,"航母"从军事专业领域,也火到了普通人的视野中. 图源网络 人们一边感叹我国实力强劲,一边对"航 ...
- 【WPF】CAD工程图纸转WPF可直接使用的xaml代码技巧
前言:随着工业化的进一步发展,制造业.工业自动化等多领域,都可能用到上位监控系统.而WPF在上位监控系统方面,应该算是当下最流行的前端框架之一了.而随着监控体系的不断完善与更新迭代,监控画面会变得越来 ...
- Maven-打包jar指定main函数所在类的一个例子
问题描述:maven打包jar时,由于带main方法的类没有被加入manifest中,导致执行java -jar mvn-jar-1.0-SNAPSHOT.jar时,会提示没有主清单属性. 解决办法: ...
- Kubebuilder简介与架构
什么是Kubebuilder Kubebuilder是一个用Go原因构建Kubernetes APIs的框架,通过使用KubeBuilder,用户可以遵循一套简单的编程框架,使用CRD构建API.Co ...
- iOS OC纯代码企业级项目实战之我的云音乐(持续更新))
简介 这是一个使用OC语言,从0使用纯代码方式开发一个iOS平台,接近企业级商业级的项目(我的云音乐),课程包含了基础内容,高级内容,项目封装,项目重构等知识:主要是讲解如何使用系统功能,流行的第三方 ...
- scrapy框架入门
scrapy迄今为止依然是世界上最好用,最稳定的爬虫框架,相比于其他直接由函数定义的程序, scrapy使用了面向对象并对网页请求的过程分成了很多个模块和阶段,实现跨模块和包的使用,大大提升了代码的稳 ...
- 数组容器(ArrayList)设计与Java实现,看完这个你不懂ArrayList,你找我!!!
数组容器(ArrayList)设计与Java实现 本篇文章主要跟大家介绍我们最常使用的一种容器ArrayList.Vector的原理,并且自己使用Java实现自己的数组容器MyArrayList,让自 ...
- appium实现简单的功能测试
实现思路 思路: 1.获取capabilities信息 2.启动app(包含安装过程) 3.检查是否安装成功 4.卸载app 5.检查是否卸载成功 6.执行×3 from time import sl ...
- PTA(BasicLevel)-1013 数素数
一.问题描述 令 Pi 表示第 i 个素数.现任给两个正整数 M≤N≤104,请输出 PM 到 PN 的所有素数. 输出格式:输入在一行中给出 M 和 N,其间以空格分隔. 输 ...
- Git 中的回退操作:reset 和 revert
Git 中回退有 reset 和 revert,这两个的区别就是是否保留更改记录 假设当前的提交情况是:A <- B <- C <- D <- HEAD,如下图: 当前是 D, ...