记录一下，关于this.$refs.$parent的算法和定义

最新推荐文章于 2022-07-15 09:41:53 发布
最新推荐文章于 2022-07-15 09:41:53 发布
阅读量420 收藏
点赞数
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/sinat_41694829/article/details/108253921
版权

在一篇代码里，除了根部的div，里面的div都不算是$parent,截图说明一下
在这里插入图片描述
此仅代表个人观点，也亲自测试过，如有不对，欢迎指教

missGril
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Vue 解决通过this.$refs来获取DOM或者组件报错问题
10-15
1. **关于`this.$refs`的使用场景** - **普通元素**：当`ref`属性添加到HTML的普通元素上时，`this.$refs.refName`将引用对应的DOM元素。例如，以下代码中`this.$refs.p`将指向包含文本"hello"的`<p>`元素： ```...
vue列表单项展开收缩功能之this.$refs的详解
10-17
在这个场景中，`this.$refs` 被用来实现列表单项的展开和收缩功能。下面我们将深入探讨如何使用`this.$refs`以及在实现列表展开收缩功能时的关键步骤。 首先，我们要明白`this.$refs` 的用法。在Vue模板中，我们...
vue 父子组件之间访问 this.$refs 和 this.$parent
Dafei4的博客
05-02 1485
01)vue父组件访问子组件this.$refs <div id="app"> {{ message }} <button value="点击" @click="p_click">点击获取子组件</button> <children_fei ref="children_ref"> </children_fei&...
7、Vue 组件-props属性，$refs和$parent
红鹰
08-08 259
Vue组件1、简单Vue组件1.1、根组件 案例 App.vue1.2、Home组件案例 Home.vue2、父组件向子组件传递参数--props属性2.1、父组件案例 Father.vue2.2、子组件案例 child.vue3、父子组件相互间访问-`$refs`和`$parent`3.1、父组件案例 MyF.vue3.2、子组件案例 MyC.vue 1、简单Vue组件 每一个.vue文件都是一个组件，包括模板template，业务逻辑 script 和样式style Vue项目的每个应用都是一个个小组
vue2.0中this.$parent和this.$refs的使用
u014645827的博客
07-15 792
vue2.0中this.$parent和this.$refs的使用
Vue里$refs与$parent用法及练习
weixin_44107140的博客
10-27 1414
Vue里$refs用法 用法一：ref加在普通的元素上，用this.$refs.name获取到的是dom元素 用法二：ref加在组件上，用this.$refs.name获取到的是组件实例，可以使用组价的所有方法 $parent用法 通过this.$parent可以访问到当前组件的父组件里所有的数据以及方法 Vue组件通信练习巩固 题目： 在Vue实例下data数据层有一个数组list(数据任意存放)，2个组件，组件1 cpn1有子组件cpnn1，cpnn1有子组件cpnnn1, 在组件cpnnn1
this.$toast() 了解一下？
12-03
【标题】: "Vue.js中的`this.$toast()`方法解析" 【描述】: 在前端开发中，经常需要处理各种提示信息，例如浮层提示。传统的做法是为每个页面单独引入和控制这些组件，但这并不高效。`this.$toast()`提供了一种更...
Vue 报错TypeError: this.$set is not a function 的解决方法
10-17
在这个例子中，`$.ajax`的`success`回调函数中的`this`并没有指向Vue实例，而是指向了回调函数本身，因此无法调用`this.$set`。 ### 报错原因 在JavaScript中，函数内部的`this`值取决于函数的调用方式。在上述...
VUE中 ref $refs 使用详解，扩展到$parent 、$children 的使用
zhouzuoluo的博客
07-18 1万+
$refs 的使用方法就是在元素或组件标签上添加ref属性指定一个引用信息，引用信息将会注册在父组件的$refs对象上，在js中使用$refs来指向DOM元素或组件实例；   应用一：在DOM元素上使用$refs可以迅速进行dom定位，类似于$("selectId")，如下 ​ &lt;template&gt; &lt;div class="parent"&gt; &lt;...
vue学习笔记：父子组件之间的传值$refs和$parent，以及父组件给子组件传值props
lhxsirky的博客
08-29 3562
父组件获取子组件的值和方法 父组件： html代码 <!-- 父组件获取子组件的值 --> <v-header ref="headerTY"></v-header> <button @click="getData">父组件获取子组件的值和方法</button> js代码： <script> import H...
vue组件化开发——$refs,$parent,$child,$el
weixin_47450807的博客
02-10 471
在vue中我们应当尽可能少的操作DOM，但是如果我们不使用一些原生的API，如何获取某一个DOM元素呢? 在vue中存在一些$refs,$parent,$root,$el可以帮助我们获取。 一、$refs 这里使用ref来绑定组件，在其父组件中可以使用this.$refs.名称来获取该组价，可以通过this.$refs.属性名.$el来获取组件对象。 二、$parent 获取父元素的组件对象 三、$root $root是获取App组件对象。 ...
vue中this.$parent、this.$root、this.$children、this.$ref的区别和作用
喜欢分享,善于记录工作中遇到的问题,和自己的思考
05-13 4226
vue组件之间的通信 1.this.$refs 是一个对象，持有已注册过的所有子组件。 ref为子组件指定一个名称，通过this.$refs.ref指定的子组件名称 即可获得对该子组件的操作 （包括data中定义的数据和methods中定义的方法） 2.this.$parent 可以直接操作当前组件的父组件 3.this.$root 可以直接操作当前组件的所有祖先组件的根组件 4.this.$children 是一个数组，可以操作当前组件的所有子组件 例子 this.$refs使用 父组件
this.$children、this.$refs、this.$parent、this.$root
weixin_43939111的博客
04-28 5816
一、当需要拿到所有子组件的时候才会通过this.$children，返回的是一个存放所有子组件的数组，一般很少用，除非你的组件顺序变化不大且能清楚记住子组件的位置 this.$children[3].username //获取第四个子组件的data里的username数据 二、this.$ refs，给组件绑定ref属性，相当于html获取dom元素，this.$ refs返回的是一个对象 this.$refs.titleCpn.aaa //获取titleCpn组件中的aaa数据 ...
vue 父组件通过 ref 调用子组件实例
David_jiahuan的博客
07-19 718
子组件代码： 父组件代码： 父组件中获取子组件实例的代码： this.$refs.parent.$refs.mychart 前半段：this.$refs.parent 是为了获取当前父组件的实例； 后半段：.$refs.mychart 是为了通过父组件内的 $ref 引用找到子组件对应的 ref，也就是mychart； ...
Vue介绍$parent()方法和$refs()方法
热门推荐
weixin_43966487的博客
01-24 1万+
Vue介绍parent()方法和parent()方法和parent()方法和refs(）方法 首先介绍这个两个方法的用处：parent()方法是在子组件中可以直接访问该组件的父实例或组件；而refs（）方式可以用来访问子组件的中的数据。 贴出代码 3.分析方法:（1）在41-51行代码中使用了parent()方法，首先不难看出this.parent()方法，首先不难看出this.paren...
本文介绍了vue组件 $children,$refs，$parent的使用
GoodIdea
07-06 629
如果项目很大，组件很多，怎么样才能准确的、快速的寻找到我们想要的组件了？？ 1）$refs 首先你的给子组件做标记。demo ：&lt;firstchild ref="one"&gt;&lt;/firstchild&gt; 然后在父组件中，通过this.$refs.one就可以访问了这个自组件了，包括访问自组件的data里面的数据，调用它的函数 2）$children 他返回的是一个组件...
vue---父调子 $refs （把父组件的数据传给子组件）子调父 $emit (把子组件的数据传给父组件)
大灰狼的小绵羊哥哥的博客
03-02 4289
ps:App.vue 父组件 　 Hello.vue 子组件 App.vue : import hello from './components/Hello' export default { name: 'app', 'components': { hello }, methods: { 　　parentCall () { 　　　　this.$refs.chil.c
vue2的this.$parent.$parent.$parent.$refs
最新发布
09-01
在Vue2中，使用`this.$parent.$parent.$parent.$refs`可以访问父组件的父组件的父组件的`refs`对象。引用的代码是一个示例，其中父组件中的`this.$refs["detailForm"]`指向子组件`PDetail`的实例，通过`this.$parent.$parent.$parent.$refs`可以在子组件中访问父组件的父组件的`refs`对象。具体来说，在上述代码中，父组件`Appe`通过`ref="detailForm"`将子组件`PDetail`引用为`"detailForm"`，然后在子组件中可以使用`this.$parent.$parent.$parent.$refs.detailForm`来访问父组件的`refs`对象中的`detailForm`属性。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* [vue组件 $children,$refs，$parent的使用详解](https://download.csdn.net/download/weixin_38669091/12775877)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] - *2* *3* [vue中this.$parent、this.$root、this.$children、this.$ref的区别和作用](https://blog.csdn.net/weixin_44684303/article/details/124748102)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值