vue组件通信之任意级组件之间的通信

news/2024/7/10 2:35:13 标签: vue, component
<div id="app">
    <comp1></comp1>
    <comp2></comp2>
</div>
let event = new Vue();

Vue.component('comp1', {
    template: `
        <div>
            <p>我是第一个组件</p>
            <input type="text" @keyup="send" v-model="comp1_msg"/>
        </div>
    `,
    data(){
        return {
            comp1_msg: ''
        }
    },
    methods: {
        send(){
            event.$emit('comp1_send', this.comp1_msg);
        }
    }
});

Vue.component('comp2', {
    template: `
        <div>
            <P>我是第二个组件</P>
            <p>{{comp2_msg}}</p>
        </div>
    `,
    data(){
        return {
            comp2_msg: ''
        }
    },
    mounted(){
        let me = this;
        event.$on('comp1_send', function(data){
            me.comp2_msg = data;
        });
    }
});

new Vue({
    el: "#app"
})

http://www.niftyadmin.cn/n/887257.html

相关文章

运行查看mysql用户权限_Mysql用户与权限管理操作

一、基本的用户管理新安装的mysql默认只有root用户&#xff0c;如果所有应用都使用root用户&#xff0c;将涉及到许多的权限与安全问题&#xff0c;所以需要创建不同的用户并设置密码来执行不同的操作。mysql中的用户与密码存在mysql库的user表里。登录mysql使用如下命令查看用…

服务器br0网桥地址修改 命令,详解修改docker启动默认网桥docker0为自定义网桥

自定义网桥除了默认的 docker0 网桥&#xff0c;用户也可以指定网桥来连接各个容器。在启动 Docker 服务的时候&#xff0c;使用 -b BRIDGE或--bridgeBRIDGE 来指定使用的网桥。如果服务已经运行&#xff0c;那需要先停止服务&#xff0c;并删除旧的网桥。$ sudo service docke…

mysql boolean转字符串_Java项目中如何将Boolean与字符串进行转换

Java项目中如何将Boolean与字符串进行转换发布时间&#xff1a;2020-11-26 15:55:40来源&#xff1a;亿速云阅读&#xff1a;100作者&#xff1a;LeahJava项目中如何将Boolean与字符串进行转换&#xff1f;相信很多没有经验的人对此束手无策&#xff0c;为此本文总结了问题出现…

mysql问题分析工具_mysql数据库 使用分析工具 进行慢查询分析

优化sql语句步骤:1.发现问题2.分析执行计划3.优化索引4.改写sql(再达不到优化效果的话 进行数据库分库分表)1.发现问题途径1.用户上报性能问题2.慢查询日志发现问题SQL3.数据库实时监控长时间运行的SQL2.设置MYSQLset global slow_query_log on/off (慢查询开关)set global sl…

mysql+e+eof_25.第19章 MYSQL数据库

一.mysql数据库基于二进制包一键安装脚本#mysq5.6基于二进制包一键安装脚本#!/bin/bash##********************************************************************#Author: zhanghui#QQ: 19661891#Date: 2021-01-26#FileName&#xff1a; install_mysql5.6.sh#URL: www.neteagl…

mysql 远程过程调用(rpc)协议出现错误 怎么解决_遭遇:“传入的表格格式数据流(TDS)远程过程调用(RPC)协议流不正确” 错误...

http://www.cnblogs.com/delphinet/archive/2010/03/09/1681777.html正在写一个类似文章的发表系统。其中记录文章内容的字段Contents设计为varchar(Max)类型。其中在DAL层调用存储过程来插入数据的参数SqlParameter[] parameters {new SqlParameter("Contents", Sq…

Vue mixins(混合)的理解,有哪些应用场景?源码分析

一、mixin是什么 Mixin是面向对象程序设计语言中的类&#xff0c;提供了方法的实现。其他类可以访问mixin类的方法而不必成为其子类。 Mixin类通常作为功能模块使用&#xff0c;在需要该功能时“混入”&#xff0c;有利于代码复用又避免了多继承的复杂。 Vue中的mixin 先来…

在MySQL中怎么进行多表删除_MySQL中多表删除方法

如果您是才接触MySQL的新人&#xff0c;那么MySQL中多表删除是您一定需要掌握的&#xff0c;下面就将为详细介绍MySQL中多表删除的方法&#xff0c;供您参考&#xff0c;希望对你学习掌握MySQL中多表删除能有所帮助。1、从MySQL数据表t1中把那些id值在数据表t2里有匹配的记录全…