vue3中的getCurrentInstance()函数,为什么要解构出proxy，因为proxy是响应式对象，要用响应式对象

最新推荐文章于 2024-01-09 17:12:35 发布
最新推荐文章于 2024-01-09 17:12:35 发布
阅读量772 收藏 2
点赞数 1
文章标签： vue.js 前端 javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Frank_colo/article/details/134390535
版权

Vue3组合式API：getCurrentInstance_vue3 getcurrentinstance-CSDN博客

1.getCurrentInstance函数只能写在生命周期钩子函数里，不能写在除生命周期之外的普通函数里，写了拿到的是null

2.调用 getCurrentInstance函数拿到的是一个对象，这个对象里还有ctx和proxy,这两个都是对象，但是这两个对象不同

ctx是普通对象不是响应式的

proxy是响应式的对象，所以我们使用响应式的对象，就把proxy解构出来了

烟火的降落
关注
  • 1
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Vue3 的响应式和以前有什么区别，Proxy 无敌？
10-15
主要介绍了Vue3 的响应式和以前有什么区别,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
一步一步实现Vue的响应式(对象观测)
10-16
主要介绍了一步一步实现Vue的响应式(对象观测)，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
vue3的getCurrentInstance获取组件实例踩坑记录
最新发布
时清云的博客
01-09 1624
而 vue 相关生态的使用其实就是他们内部的事情了，他们有完善的测试用例可以跑测试，但是我们并没有，如果后续的某一个版本Vue变更了这个API，那么如果没有经过完整测试就部署上去的项目就会出现大规模的BUG反馈了。，getCurrentInstance 的返回值是一个组件实例对象，可以通过 .ctx 来访问该实例的上下文对象，或者通过 .proxy 来访问该实例的代理对象。两者的区别在于，通过 .ctx 访问的是真实的组件实例，而通过 .proxy 访问的是一个代理对象，该代理对象可以在模板中直接使用。
vue3的getCurrentInstance()方法拿到的实例对象中的proxy
Frank_colo的博客
07-07 1491
实例对象中的成员proxy是一个代理对象，可以通过访问代理对象来间接访问当前组件的实例对象。getCurrentInstance方法拿到的是当前组件的实例对象。这样就不需要this，也可以操作当前组件的实例对象了。
Vue3中getCurrentInstance()方法详解
Dennis_nafla的博客
10-22 5857
proxy只是一个变量名，翻译过来是“代理”的意思。
es6语法特性,解构，箭头函数，尾调用优化，proxy,primise,async,装饰器
weixin_45574792的博客
07-14 397
1.let,const let,const定义的变量，不是绑定在window下。 2.解构,ES6 允许按照一定模式，从数组和对象中提取值，对变量进行赋值，这被称为解构（Destructuring）。 //数组解构 let [a, b, c] = [1, 2, 3]; //对象解构 let { foo, bar } = { foo: 'aaa', bar: 'bbb' }; foo // "aaa" bar // "bbb" //字符串解构 const [a, b, c, d, e] = 'hello';
Vue3组合式API：getCurrentInstance
Zaralike的博客
07-19 1万+
vue3 getCurrentInstance API
getCurrentInstance
热门推荐
weixin_45974259的博客
03-30 2万+
getCurrentInstance getCurrentInstance支持访问内部组件实例。 WARNING getCurrentInstance只暴露给高阶使用场景，典型的比如在库中。强烈反对在应用的代码中使用getCurrentInstance。请不要把它当作在组合式 API 中获取this的替代方案来使用。 import { getCurrentInstance } from 'vue' const MyComponent = { setup() { const ...
Vue数组响应式操作及高阶函数使用代码详解
10-15
主要介绍了Vue数组响应式操作及高阶函数使用代码详解,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
vue3为什么要用proxy替代defineProperty
01-18
不管是vue2还是vue3，在实现的过程中，核心概念一直保持稳定，以可变数据源为核心的理念，来实现整个UI变动更新 用最简单的讲法就是：初始化数据生成了页面，直接修改源数据触发更新，页面重新渲染 关注vue的人都...
稍微学一下Vue的数据响应式（Vue2及Vue3区别）
10-15
主要介绍了稍微学一下 Vue 的数据响应式（Vue2 及 Vue3），文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
Vue3中的公共数据配置globalProperties getCurrentInstance、网络代理配置
看见小狮子没
09-21 1万+
1、
Vue3组合式API之getCurrentInstance详解（在行为验证码之滑动验证AJ-Captcha遇到在开发环境可以，测试环境报错）
m0_52263688的博客
11-01 1616
ctx和proxy都是getCurrentInstance()对象中的属性，通过解构赋值的方式拿到。但是在Vue3中，在setup中无法通过this获取组件实例的。所以在Vue3中，我们可以通过getCurrentInstance()来获取当前组件实例。首先大家知道我们可以通过 getCurrentInstance这个函数来获取当前组件的实例对象,也就是当前vue这个实例对象。由于本人在使用AJ-Captcha插件的过程中发现在开发环境调试正常，但是测试环境会报错，获取不到组件实例。开发中只适用于调试！
解析Vue2.0和3.0的双向数据绑定原理和异同(带源码)
qq_43429002的博客
08-05 1847
解析Vue2.0和3.0的双向数据绑定原理和异同(带源码) Vue2.0和Vue3.0实现原理 Vue 2.0 Vue2.0实现MVVM(双向数据绑定)的原理是通过 Object.defineProperty 来劫持各个属性的setter、getter，在数据变动时发布消息给订阅者，触发相应的监听回调。 Vue官网也给出了解释: Vue 3.0 实现响应式基于ES6:Proxy Vue2.0和Vue3.0的差异如下: Vue2.0 基于Object.defineProperty，不具备监听数组的能力，需
Vue3.0 — axios、getCurrentInstance
zxw的博客
04-07 1943
axios 安装 npm install axios -S 使用 1、在main.js中引入aixos import axios from "axios" 2、挂载到根实例上 vue3.0新增了一个函数createApp()，用于创建根实例 const app = createApp(App) app.config.globalProperties.$axios = axios // 挂载到Vue上的写法 3、在组件上使用axios vue3的setup函数中的this为undefined，需要使用组合A
vue3 解决getCurrentInstance 打包后线上环境报错问题
总结前端开发中遇到的问题，分享前端知识
05-24 2959
getCurrentInstance只暴露给高阶使用场景，典型的比如在库中。强烈反对在应用的代码中使用getCurrentInstance。请不要把它当作在组合式 API 中获取this的替代方案来使用。
vue3+ts中对getCurrentInstance的使用
weixin_47239456的博客
08-15 1871
vue3+ts中对getCurrentInstance的使用
vue3+ts 使用 getCurrentInstance 报错解决
qq_43532275的博客
11-10 6755
vue3+ts 使用 getCurrentInstance 报错解决
Vue3中响应式对象解构
06-06
在Vue3中，可以通过`reactive`函数将一个普通对象转换为响应式对象，同时也可以通过解构语法来获取响应式对象中的属性值。例如： ```javascript import { reactive } from 'vue' const state = reactive({ count:...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值