Vue $emit()不能触发父组件方法的原因

最新推荐文章于 2024-09-27 21:00:00 发布
最新推荐文章于 2024-09-27 21:00:00 发布
阅读量9.7k 收藏 6
点赞数 7
CC 4.0 BY-SA版权
分类专栏： vue 文章标签： vue $emit 不能触发
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/weixin_41472431/article/details/89434160
本文详细介绍了在Vue框架中使用$emit方法时的注意事项，强调了事件名称必须使用小写，避免使用大写的驼峰命名规则。同时提供了解决方案，即通过this.$parent调用父组件的方法。

$emit传入的事件名称只能使用小写，不能使用大写的驼峰规则命名

如果修改后还是不行的话，就改用：

   this.$parent.Event       (Event为父组件中的自定义方法)

 

Vue3里通过defineProps和defineEmits两个宏函数进行父子组件传递数据
qq_37635012的博客
10-09 5859
vue3父子组件通信，vue3里props使用，vue3里emit使用
Vue中emit事件无法触发的问题
y_hh_的博客
08-16 4062
在父组件中定义事件监听，会出现无法触发对应的事件函数，在下面的代码中，我想通过v-on:event_1=“handle”, 想监听子组件中的event_1事件，但尽管事件发生了， 但还是触发不了，这个问题在于v-on:event_1="handle"的位置，需要放在 <my-template :users=“users” v-on:event_1=“handle” ></my-template> 中。 <body> <div id='app' v-on:ev
Vue $emit()不能触发父组件方法的原因及解决
10-15
主要介绍了Vue $emit()不能触发父组件方法的原因及解决，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
vue3 setup emit 不生效 子组件中的值回传给父组件
weixin_44166439的博客
04-20 4255
父组件 <Input v-model="val"/> 子组件 <input v-model="input" /> props: { modelValue: { tppe: [ String | Number], default: '', }, }, setup() { const input = ref('') const clearVal = () => { input.value = '' emit('
Vue $emit $refs子父组件间方法的调用实例
11-30
当子组件需要向父组件发送信息时，可以使用`$emit`方法触发一个自定义事件。在子组件中，我们可以在方法中调用`this.$emit(eventName, data)`来触发事件，其中`eventName`是你自定义的事件名，`data`是要传递的数据...
解决Vue.js父组件$on无法监听子组件$emit触发事件的问题
10-18
为了帮助大家解决这一问题，以下将详细阐述Vue.js中父组件$on监听子组件$emit事件的正确实现方式。 首先，我们来了解一下Vue.js中事件监听和触发的基本概念。在Vue.js中，$on方法用于在当前实例上监听一个自定义...
vue $emit不能触发父组件的原因
weixin_43660344的博客
08-24 1047
vue 不能触发$emit的原因 在使用emit时只能小写不能使用驼峰命名规则。如果改为小写还是不行，可以试试this.emit时只能小写不能使用驼峰命名规则。如果改为小写还是不行，可以试试 this.emit时只能小写不能使用驼峰命名规则。如果改为小写还是不行，可以试试this.parent.Event (Event为父组件中的自定义方法) 参考：https://blog.youkuaiyun.com/weixin_41472431/article/details/89434160 ...
vue3中组件递归，子组件emit事件失效解决办法
qq_52273262的博客
01-08 2903
在嵌套的子组件加上emit事件的监听，缺点就是控制台有警告。用vuex / pinia 代替父子通信。
vue3 setup 中的 emit事件触发
green_dream123的博客
10-20 9992
** vue3 setup 中的 emit事件触发 ** 父组件 <template> <PaymentDlg ref="paymentDlg" @onSaveOk="paymentTest" /> </template> <script setup> import PaymentDlg from './dashboards/payment-dlg.vue' import { ref } from "vue"; const paymentDlg = ref(
上班日记3——vue3爷，父，子在script setup下的defineEmits，事件命名等均无问题，但依旧不能触发爷组件方法
dlchgg的博客
08-19 857
3、使用nexTtick试试——都成习惯了，经常类似的问题都是如此，实际上emit通信因为nexttick而出问题感觉没有，但是不知道有没有特定情况。1、vue3也是这个新工作才接触，是不是我的defineEmits使用的有问题。1、子组件内使用defineEmits，父组件内设置handleBinduser方法，让子触发父。弊端嘛就是，太麻烦了，本来就是父和爷组件，现在还要多一个子触发父，而且公用的一个子组件，懒得写。2、可能需要驼峰命名。
Vue中央事件总线$bus跨父子组件无限层级通信（解决$bus.emit 第一次不触发、通信传值数据监听等）
前端与全栈技术领域探索者，分享实用干货与实战经验，助力开发者成长
03-31 2893
使用场景： 多种类跨组件全局搜索实现，vuex对于当前场景过于繁琐庞杂，由此想用vue中央事件总线bus去处理。 使用问题： 因为$emit先于$on执行了，所以接受传值的组件无法获得第一次数据； 解决办法： main.js //中央事件总线 Vue.prototype.$bus=new Vue(); 传值组件 onSearch(value) { this.Sdata.svalue=value; // 加定时器，防止$emit先于$on执行了，否则无法获得第一次数据； setTimeout
vue emit 触发事件不生效
weixin_39818813的博客
12-05 2439
很有可能是你接收事件写成接收属性了 如：这样是接收属性 <view class="nav-top"> <BtnNav :btnList="btnList" :changebtn="changebtn"></BtnNav> </view> 这样才是接收事件： <view class="nav-top"> <BtnNav :btnList="btnList" @changebtn="change
Vue $emit()不触发方法的原因
青春不打烊的博客
04-20 2660
vue使用$emit时，父组件无法触发监听事件的原因是： $emit传入的事件名称只能使用小写，不能使用大写的驼峰规则命名
vue3 全局事件总线mitt，emit发布无效果
qq_43721254的博客
04-12 1139
很多刚开始接触vue3的朋友可能不太注意vue3的生命周期，需要注意vue3的setup只会执行一次，很可能把emit和on放在setup中一起执行，最后的结果只能是没有任何效果，最好就是放在onMounted中。
vue解决父组件调用子组件传值只执行一次问题
qq_43653355的博客
04-04 3542
解决方法： 给子组件加上一个key值 ：key="timer" 在data中加上timer timer：' ' 刷新子组件传的值的话在方法中加上 this.timer = new Date().getTime()
vue3 子调用父中的方法
leveretz的博客
11-09 4664
vue3 子调用父中的方法
Vue $emit()不能触发父组件方法，Vue子组件向父组件使用自定义事件$emit传递数据无效的坑
m0_61672533的博客
01-03 1334
Vue子组件向父组件使用自定义事件$emit传递数据无效的坑
Vue3+el-menu 递归 emit失效
最新发布
weixin_43932309的博客
09-27 692
解决Vue3+el-menu 递归 emit失效问题
vue $emit()不能触发父组件方法的原因及解决
05-01
在使用Vue的$emit() 方法时，有时候会发现不能触发父组件方法。 这通常是由于传递给$emit()方法的事件名称与父组件中方法名称不一致所导致的。在父组件中需要监听的事件名称和$emit()方法中传递的事件名称必须一致...
评论 5
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值