关于Vue3父子组件emit参数传递问题(解决Vue2this.$emit无效问题)

 更新时间:2022年07月27日 10:04:18   作者:韦_恩  
相信很多人在利用事件驱动向父组件扔东西的时候,发现原来最常用的this.$emit咋报错了,竟然用不了了,下面通过本文给大家分享关于Vue3父子组件emit参数传递问题(解决Vue2this.$emit无效问题),需要的朋友可以参考下

之前写了一篇Vue3路由跳转问题的博客,发现还是有很多同学对基本的使用改变还没有了解,于是我就顺道把常用的组件间传递的方式也写一下吧.......

注意的是:

1.Vue3中不在强调this的使用,可以说你在setup中完全不能用this,不像Vue2中把全部的内容都集成到this中。

2.Vue3现在由于compositionAPI的方式可以说是弱化了Vuex的存在(当然Vuex现在可以用没什么变化)。

3.如果您有Vue2的开发经历,用Vue3也不会特别陌生,会很快上手。

1.解决this.$emit无效问题

相信很多人在利用事件驱动向父组件扔东西的时候,发现原来最常用的this.$emit咋报错了。竟然用不了了.....原因在这里:

this.$emit集成到了setup函数中的context上下文中了

所以我们应该这么写:

详细内容请看文档 :

vue3中文官网连接(context上下文)

当然在标签內部的emit方式是没有变的,依然可以用:

2.Vuex问题

在vuex部分其实没什么变化,和路由一样更换了创建实例方式。

在main.js中引入方式有所调整。

3.总结

我们在使用Vue3的时候如果发现原来的啥命令不好使了,不要害怕,不是取消了就是折腾了下,打开文档瞅一瞅........基本就能解决了。欢迎大佬留言补充。

如果有对路由push不清楚的 请看我的这篇文章:

https://www.jb51.net/article/256972.htm

到此这篇关于关于Vue3父子组件emit参数传递问题(解决Vue2this.$emit无效问题)的文章就介绍到这了,更多相关Vue3父子组件emit参数传递内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • VueJs 搭建Axios接口请求工具

    VueJs 搭建Axios接口请求工具

    axios 是一个基于Promise 用于浏览器和 nodejs 的 HTTP 客户端。今天我们来介绍VueJs 搭建Axios接口请求工具,需要的朋友参考下本文吧
    2017-11-11
  • 搭建Vue3+Vite+Ts脚手架的示例代码

    搭建Vue3+Vite+Ts脚手架的示例代码

    本文介绍了Vue3+Vite+Ts搭建脚手架的实现,步骤包括创建项目、选择技术栈、安装依赖及运行项目,旨在为开发者提供一个简易快速的搭建流程,感兴趣的可以了解一下
    2024-11-11
  • vue如何对一个数据过滤出想要的item

    vue如何对一个数据过滤出想要的item

    这篇文章主要介绍了vue如何对一个数据过滤出想要的item问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
    2023-10-10
  • vue如何实现角色权限的控制

    vue如何实现角色权限的控制

    关于角色与权限控制,通常是分为两大类,一种是菜单权限,一种是操作权限,本文将深入探讨如何通过 Vue 实现角色权限控制,特别是基于按钮级别的权限控制,需要的可以了解下
    2025-02-02
  • VUE搭建手机商城心得和遇到的坑

    VUE搭建手机商城心得和遇到的坑

    这篇文章主要介绍了VUE搭建手机商城心得和遇到的坑,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2019-02-02
  • vue2中如何自定义组件的v-model

    vue2中如何自定义组件的v-model

    这篇文章主要介绍了vue2中如何自定义组件的v-model,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-08-08
  • vue中this.$refs有值,但无法获取ref的值问题及解决

    vue中this.$refs有值,但无法获取ref的值问题及解决

    这篇文章主要介绍了vue中this.$refs有值,但无法获取ref的值问题及解决方案,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2023-01-01
  • Vue中添加过渡效果的方法

    Vue中添加过渡效果的方法

    本篇文章主要介绍了Vue中添加过渡效果的方法,Vue 在插入、更新或者移除 DOM 时,提供多种不同方式的应用过渡效果,有兴趣的同学可以了解一下。
    2017-03-03
  • vue 使用Jade模板写html,stylus写css的方法

    vue 使用Jade模板写html,stylus写css的方法

    这篇文章主要介绍了vue 使用Jade模板写html,stylus写css的方法,文中还给大家提到了使用jade注意事项,需要的朋友可以参考下
    2018-02-02
  • Vue.js中的绑定样式实现

    Vue.js中的绑定样式实现

    这篇文章主要介绍了Vue.js中的绑定样式实现,展开的内容呦style绑定样式和绑定class样式,具体相关内容需要的小伙伴可以参考下面文章介绍
    2022-05-05

最新评论