vue3 Composition ApI总结
1.setup
setup中不能用this,因为setup是在实例被完全初始化之前的执行的,而在实例被初始化之前是没有this的,
它不能调用实例上的方法,但是实例上的方法可以调用它
2.响应式处理reactiv、ref、readonly、torefs、toref、context
reactiv和ref
//reactive,ref 响应式的引用
//原理 ,通过proxy对数据进行封装,当数据变化时,触发模板等内容的更新
//ref处理基础了类型的数据
//reactive处理非基础类型的数据 对象{} 数组[]
Readonly 把数据变成只读,不允许修改
toRefs
toRef
context
3.计算属性computed
4.Watch和watchEffect
watch 侦听器
//1.watch具备一定的惰性
//2.参数:一个是当前值,一个是原始值
//3.一个侦听器可以侦听多个数据的变化
watchEffect
5.生命周期函数的新写法
vue3 Composition ApI总结相关推荐
- Vue3 Composition API(一)——setup、reactive、ref、readonly
一.Options API的弊端 在Vue2中,我们编写组件的方式是Options API: Options API的一大特点就是在对应的属性中编写对应的功能模块: 比如data定义数据.method ...
- Vue3 Composition API(三)——生命周期钩子、Provide函数 和 Inject函数、封装Hook案例、setup顶层编写方式
一.生命周期钩子 我们前面说过 setup 可以用来替代 data . methods . computed .watch 等等这些选项,也可以替代 生命周期钩子. 那么setup中如何使用生命周期函 ...
- Vue3 Composition API(二)——computed、watchEffect、setup中使用ref
一.computed 在前面我们讲解过计算属性computed:当我们的某些属性是依赖其他状态时,我们可以使用计算属性来处理 在前面的Options API中,我们是使用computed选项来完成的: ...
- Vue3 Composition API如何替换Vue Mixins
想在你的Vue组件之间共享代码?如果你熟悉Vue 2 则可能知道使用mixin,但是新的Composition API 提供了更好的解决方案. 在本文中,我们将研究mixins的缺点,并了解Compo ...
- Vue3.0 Composition API与Vue2.x 使用的 Options API
Vue3.0 所采用的 Composition API 与 Vue2.x 使用的 Options API 有什么不同 开始之前 Composition API 可以说是Vue3最大的特点,那么为什么要 ...
- js 表单设计器_准备迎接Vue3,使用Vue Composition API生成干净可扩展的表单
表单是前端开发中最棘手的部分之一,您可能会在其中发现很多混乱的代码. Vue.js 2之类的基于组件的框架在提高前端代码的可伸缩性方面做了很多工作,但是形式问题仍然存在. 在本教程中,我将向您展示新的 ...
- 谈谈vue3组合式api的优势
vue2: options API 配置式 使用传统Options API(配置式API)中,新增或者修改一个需求,就需要分别在data,methods,computed里修改 . vue3: com ...
- vue3学习笔记 Composition API setup
一.Composition API优势 相对于vue2的option API Vue3的Composition API设计更有优势 Composition(组合式)Api 功能分组 Compositi ...
- Vue3笔记_02setup与常用的Composition API(组合式API)
目录 setup setup的执行时机 [1]定义数据和方法 vue2中定义数据和方法 vue3中定义数据和方法 语法 示例-返回值为一个对象 示例-返回值为一个渲染函数 注意点 数据-响应式数据 r ...
最新文章
- Python垃圾回收机制详解
- IT人的十八般武艺-序言
- Gradle build设置自动log开关
- Android面试收集录 2D绘图与动画技术
- Android之INSTALL_FAILED_UPDATE_INCOMPATIBLE(pacakge:...do not match the previously installed version)
- python数据结构之队列(一)
- java两种不同单例模式_关于Java里的两种单例模式
- B~树(B-Tree)与B+树
- Bitcoin 0.7.0 发布, P2P网络的匿名数字货币
- H3C MSR系列路由器负载分担、链路备份的实现过程详解
- 单片机跑马灯源代码+仿真
- 计算机实验报告protel,Protel99se实验报告.doc
- 一文详解Adobe Photoshop 2020安装教程
- 利用Power Design 进行数据库设计(超详细)
- 计算机收不到打印机,打印机接收不到任务,如何添加打印机
- 节假日查询,一个简单很暴力的idea
- vue开发网站seo优化方法
- Apache服务器的下载、安装、配置等等
- 读论文——A Joint Model for Aspect-Category Sentiment Analysis with Shared Sentiment Prediction Layer
- centos 6.7 mysql密码忘记_CentOS 7安装MySQL5.7以及忘记root密码怎么办