位置: IT常识 - 正文
使用 Vue3 开发了四个月，回顾 emit 的用法(使用vue开发app)
编辑：rootadmin推荐整理分享使用 Vue3 开发了四个月，回顾 emit 的用法(使用vue开发app)，希望有所帮助，仅作参考，欢迎阅读内容。
文章相关热门搜索词:vue3 key,vue3 key,vue3开发app,vue3.0开发,vue3 key,vue3开发app,vue3 key,vue3开始用了吗,内容如对您有帮助，希望把文章链接给更多的朋友！
3.但是在某些场景中，我们在子组件中确实是需要去修改 props 的，那么这种场景该如何处理呢？
4.这里就需要父组件在传递 props 的同时提供一个修改 props 的方法，（这个方法也是通过 props 传递的）
5.这样做虽然有些繁琐，但是对于后期数据维护和修改代码是非常友好的，因为你可非常清楚的知道某一个 props 来自与那个父组件。
6. 这里列举了一个简单的 demo ，大致用法如下所示：
二. Vue 子组件修改 props 的思想理念刚开始学习 vue 的时候，我有点先入为主的感觉了，感觉如果修改 props 的话，父组件就必须同时提供一个修改的方法。以为 vue 也是这样，其实也是可以的，vue 确实也可以通过 props 去同时提供这两样很重要的东西，并且功能是完全可以满足我们的需求的。
2. 但是这种想法其实和 vue 的理念有一点点违背，虽然我们都是避免了直接修改 props ，但是在 vue 里有它自己的理念。 我们先看一下 Vue 是怎么解释当子组件需要修改父组件提供的状态时的思想，最开始看到这里的时候，我其实没有特别理解画红线的意思。
3.并且我们顺着官网的教程，去看 emit 指令的话，真的非常难以理解官方到底想表达什么想法。我承认 Vue 的中文官网也许是最适合国人学习的教程网站，但是它也有对萌新不是那么友好的地方。
4.就像上面官网对 $emit 的解释一样，寥寥几笔，只留下我一人在风中凌乱。去搜索相关 $emit 相关的文章，有很多都是按照官网比葫芦画瓢的解释，真的非常不友好。
三. emit 的真正含义我们先看一下这个单词的原意，**“发射，发出”**的意思。这也是误导我很长时间的主要原因，因为我把这个 Vue 想表达的发射，理解成了把收到的 props 重新发射回去的意思，其实这是非常错误的理解。2.直到我学习了 v-model 指令的用法，我才彻底搞明白这个 “发射”，到底是想 “发射” 什么，它原来指的是 “发射” 一个修改 props 的通知，告诉父组件自己去修改 props。
3.举个例子，我们改造一下上面我们通过传递两个 props（一个响应式状态，一个修改状态的方法）变为下面：
4.你可以发现，原来通过 props 传递的 :addCount 变为了自定义事件 @addCount 的写法。
5.⏰重点来了： 我相信很多初学者在看到父组件自定义一个事件这一章节的时候，会产生很大的疑问。其实这里 Vue 想表达的意思是，父组件注册了一个函数，但是它不会自己去执行这个函数，它需要收到一个信号才会自己去执行。什么叫注册了一个函数呢？说白了，就是它在自己本身组件内部定义了一个函数，但是这个函数在没有收到 “信号的时候是不会去执行的”。
6.如果你能明白上一段的意思，那么你基本上就知道 “信号” 究竟是谁发出来的了。让我们回到子组件内部，在子组件内，我们需要去拿到父组件注册的那个函数名字。也就是addCount，来准备通知父组件。
7.子组件内的按钮代表的意思就是，当我点击一次按钮，我就 “发射” 一个信号，告诉父组件去执行一次 addCount 这个函数，也就是在父组件里
下一篇：如何利用Linux命令检查和对比两个文件内容区别(linux如何使用)
