前端工程现在变成了单页面富文本的模式,整体布局定下来后,跳转只在<router-view>中展示,外层的布局不容易改变。最近发现有如下这个方法可以直接传值给App.vue,经过实践确实可以实现。

1、安装依赖

npm install vue-bus

2、main.js引入

import VueBus from 'vue-bus'
Vue.use(VueBus)

3、在子页面传递数据

allWarning(){
this.$bus.emit("lowerRight",1);
}

4、在APP.vue中接收

mounted(){
//通过on监听事件,回调方法获取数据
this.$bus.on("lowerRight",value=>{
console.log(value)
});
} ,

vue子页面给App.vue传值的更多相关文章

  1. [Vue]子组件与父组件之间传值

    1.父组件与子组件传值props 1.1定义父组件,父组件传递 inputText这个数值给子组件: //父组件 //引入的add-widget组件 //使用 v-bind 的缩写语法通常更简单: & ...

  2. vue子组件向父组件传值

    vue2.0中通过$emit事件在子组件中自定义事件,通过操作子组件中的事件,向父组件传递参数: 首先写一个叫做parentComp.vue的父组件: <template> <div ...

  3. Vue子页面给父页面传递数据

    子页面: <template> <div> <p>子组件</p> <button @click="sendMsg">传递 ...

  4. vue 子页面,向父页面 传值...

    子组件 通过 事件 向父组件传值..... 父组件 方法: methods: { appendData: function (list) { console.log(list); for (var i ...

  5. vue 单页面应用 app自适应方案

    本文是使用淘宝的方案进行布局开发的,遇到的问题是会对app内使用的第三方插件,当页面进行缩放后,比如高德地图中的文字会显得过小,我使用的方法就是手动的动每一个尺寸进行手动的px 到 rem的替换,而不 ...

  6. vue 子组件向父组件传值通信

    父组件 子组件 子组件用this.$emit

  7. VUE 子组件向父组件传值 , 并且触发父组件方法(函数)

    目标:封装一个  搜索组件 <子组件需要传一个或者多个搜索参数到父组件,然后父组件执行列表查询函数> 1.子组件 <div> <input v-model="l ...

  8. 关于Vue 刷新页面

    前言 Vue 中是单页面,当然需要刷新数据咯 你一定遇到这样的需求::比如在删除或者增加一条记录的时候希望当前页面可以重新刷新或者 这个页面有个组件 ,但是这个组件里面的点击事件还是到当前页面 怎么就 ...

  9. Vue单页面应用打包app处理返回按钮

    情况 顶部返回,在header.vue公用组件中使用 this.$router.go(-1) 安卓:点击返回按钮:登录页,项目选择页,首页等几个一级页面要求提示用户是否退出app;确定,退出;取消:不 ...

  10. vue 父组件给子组件传值,子组件给父组件传值

    父组件如何给子组件传值 使用props 举个例子: 子组件:fromTest.vue,父组件 app.vue fromTest.vue <template> <h2>{{tit ...

随机推荐

  1. 【开源项目推荐】通用SQL数据血缘分析工具——Sqllineage

    大家好,我是独孤风,从本周开始,争取每周为大家带来一个优秀的开源项目推荐. 开源项目不仅促进了技术的发展和普及,还为全球范围内的开发者和用户社区建立了一个共享知识.协作和创新的平台.站在巨人的肩膀上才 ...

  2. 小傅哥带着你做 Java SDK 组件

    作者:小傅哥 博客:https://bugstack.cn 沉淀.分享.成长,让自己和他人都能有所收获! 大家好,我是技术UP主小傅哥. 今天小傅哥将开启一个新计划,带着大家一起干"开源&q ...

  3. Go语言实现GoF设计模式:适配器模式

    本文分享自华为云社区<[Go实现]实践GoF的23种设计模式:适配器模式>,作者:元闰子. 简介 适配器模式(Adapter)是最常用的结构型模式之一,在现实生活中,适配器模式也是处处可见 ...

  4. Python实现模块热加载

    为什么需要热加载 在某些情况,你可能不希望关闭Python进程并重新打开,或者你无法重新启动Python,这时候就需要实现实时修改代码实时生效,而不用重新启动Python 在我的需求下,这个功能非常重 ...

  5. bash shell笔记整理——stat命令

    stat命令的作用 stat主要用于查看文件的详细信息,包括access time(atime).modify time(mtime).change time.权限.属主.属组等信息 atime:只有 ...

  6. CentOS基线检测脚本

    本脚本适用于CentOS 7.5-7.9版本,其他版本不详 1.检查系统信息 查看代码 echo " " echo "########################## ...

  7. 2023-09-20:用go语言,保证一定是n*n的正方形,实现从里到外转圈打印的功能 如果n是奇数,中心点唯一,比如 a b c d e f g h i e是中心点,依次打印 : e f i h g

    2023-09-20:用go语言,保证一定是n*n的正方形,实现从里到外转圈打印的功能 如果n是奇数,中心点唯一,比如 a b c d e f g h i e是中心点,依次打印 : e f i h g ...

  8. Python中的@abstractmethod

      @abstractmethod 是 Python 中 abc 模块(Abstract Base Classes)提供的一个装饰器,用于声明抽象方法.抽象方法是指在抽象类中声明但没有提供具体实现的方 ...

  9. 云图说|云数据库GaussDB如何做到卓越性能

    摘要:对于数据库来说,性能一直被视为最关键的部分.GaussDB作为华为自主创新研发的分布式关系型数据库,那么华为云数据库GaussDB在提升数据库性能方面都有哪些黑科技呢? 本文分享自华为云社区&l ...

  10. 快来,这里有23种设计模式的Go语言实现

    摘要:设计模式(Design Pattern)是一套被反复使用.多数人知晓的.经过分类编目的.代码设计经验的总结,使用设计模式是为了可重用代码.让代码更容易被他人理解并且保证代码可靠性. 本文分享自华 ...