前端工程现在变成了单页面富文本的模式,整体布局定下来后,跳转只在<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. @Async实现异步任务

    1.@Async是SpringBoot自带的一个执行步任务注解 @EnableAsync // 开启异步 @SpringBootApplication public class Application ...

  2. 使用.NET Core接入飞书AI

    飞书AI接入教程 首先,准备俩个账号:ChatGPT账号.飞书账号. 飞书账号请自行注册,访问链接 www.feishu.cn/ 即可登录. 第一步,飞书进入开发者平台.点击创建应用. 填写应用名称和 ...

  3. springboot产生非法状态异常+空指针

    springboot产生非法状态异常+空指针 描述:异常描述为在响应提交后不能执行senderror方法 解决方案: 不是,哥们,你不会真觉得有什么合适的解决方案吧,网上几波前辈大佬各说各的,和我的情 ...

  4. MySQL运维实战(1.2)安装部署:使用二进制安装部署

    作者:俊达 引言 上一篇我们使用了RPM进行安装部署,这是一种安装快速.简化部署和管理过程.与操作系统提供的包管理工具紧密集成的部署方法.此外,当你需要更高的灵活性和自定义性,并且愿意承担一些额外的手 ...

  5. 1.7每日总结-vue链mysql4

    新建/server/router.js,用于配置对应路由let express = require('express')let router = express.Router()let user = ...

  6. 图片标注-----labelimage

    本人用的环境是   win10  +  python3.6 pip install labelimg 安装成功之后,找到  Anaconda 安装目录下的  Lib  , 然后找到   site-pa ...

  7. 全国网络安全行业职业技能大赛云南省选拔赛 Misc 部分WP

    word_sercet 题目 我的解答: 加密文档,010打开图片发现密码 VVV_123.com 解压打开得到flag(注:flag原本是隐藏的,但我之前设置过隐藏文字自动显示,因此这里直接可以看到 ...

  8. 在Docker上面安装/启动、运行、挂载MySQL5.7

    下载文档请看:https://hub.docker.com/r/mysql/mysql-server 一.下载镜像 执行命令: docker pull mysql/mysql-server:5.7 查 ...

  9. 牛刀小试基本语法,Go lang1.18入门精炼教程,由白丁入鸿儒,go lang基本语法和变量的使用EP02

    书接上回,Go lang1.18首个程序的运行犹如一声悠扬的长笛,标志着并发编程的Go lang巨轮正式开始起航.那么,在这艘巨轮之上,我们首先该做些什么呢?当然需要了解最基本的语法,那就是基础变量的 ...

  10. CANN开发实践:4个DVPP内存问题的典型案例解读

    摘要:由于DVPP媒体数据处理功能对存放输入.输出数据的内存有更高的要求(例如,内存首地址128字节对齐),因此需调用专用的内存申请接口,那么本期就分享几个关于DVPP内存问题的典型案例,并给出原因分 ...