父子组件传值:
父组件定义:
子父组件传值:
父组件方法定义:
子组件执行父组件方法定义:
methods: { closeOrOpenLeftMenu() { if (this.isLeftMenuOpen) { this.isLeftMenuOpen = false; } else { this.isLeftMenuOpen = true; } // 发布消息-兄弟组件 //openOrCloseLeftMenu一定要与订阅方名称一样,this.isLeftMenuOpen是通信的具体数据 PubSub.publish("openOrCloseLeftMenu", this.isLeftMenuOpen); // 触发父组件中 openMenu 事件进行删除操作 this.$emit("openMenu", this.isLeftMenuOpen); },
兄弟组件传值:
1、首先安装pubsub-js
查看pubsub-js 库是否已经存在该库命令:
npm info pubsub-js
若不存在,则先安装pubsub-js 库,命令如下:
npm install --save pubsub-js
安装完成之后再需要使用的组件应用:
import PubSub from "pubsub-js";
A组件定义(发布消息):
VUE基础架构项目
个人中心 个人中心密码重置退出系统
B组件定义(订阅消息):
知识共享:
能在这么优秀的平台和大家互相交流技术、知识很高兴。
我是多年老程序员,逐步会继续发布技术文章、授课视频、项目源码、关键点源码、技术文档等资料。
一边整理一遍发布。希望大家多多支持我,给点点关注。
本技术文档的源码,有需要的朋友可以转发+私信我。已经完成基础的VUE脚手架内容。可参考上篇文档介绍!!!