Vue子组件向父组件传值(this.$emit()方法)

子组件使用this.$emit()向父组件传值

首先必须在父组件中引用子组件,然后实现传值

  • 第一步 在父组件中引入子组件

使用import引入组件

import indexImportOrder from './components/indexImportOrder'

声明

//定义组件components:{indexImportOrder,},

使用

<indexImportOrder ref="indexImportOrder"/>
  • 第二步 子组件向父组件传值

1.  在子组件中需要向父组件传值处使用this.$emit("function",param);   //其中function为父组件定义函数,param为需要传递参数

//新订单页面跳转viewBusiness(){let flag = false;this.$emit('closeMain',flag);},

2.  在父组件中子组件引用处添加函数v-on:function="function1"; //其中function为子组件中定义函数,function1为父组件定义函数--用于接收子组件传值并进行相应数据处理,可定义为同一名称

v-on: 可用 @ 代替 @function="function1" ,@ 为 v-on:的简写
 

<indexImportOrder ref="indexImportOrder" v-on:closeMain="closeMain"/>

val及为子组件中flag,即接收的子组件参数

closeMain(val){this.flag = val;},

更详细解释可参照:https://www.cnblogs.com/padding1015/p/7878741.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/52378.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

shell 06(shell内置命令)

一、内置命令介绍 shell 内置命令&#xff0c;就是由 Bash shell 自身提供的命令&#xff0c;而不是文件系统中的可执行文件 使用type 来确定一个命令是否是内置命令: type 命令 通常来说&#xff0c;内置命令会比外部命令执行得更快: 执行外部命令时不但会触发磁盘 I/0&am…

Spring Boot使用MySQL的默认连接池

笔者在近期秋招面试的时候被问到了这个问题&#xff0c;现在简单梳理一下便于后期重新回顾&#xff0c;并加深记忆。 Spring Boot 默认使用的数据库连接池是 HikariCP(开源库地址)。 HikariCP 是目前性能最好的连接池之一&#xff0c;它具有高度的性能、可靠性和可扩展性&…

MyBatis的核心技术掌握,简单易懂(上)

目录 一.MyBatis中的动态SQL 二.MyBatis中的模糊查询 1. # 符号 2. $ 符号 ---问题 ---所以大家知道 # 和 $ 在MyBatis中的模糊查询中的区别了嘛&#xff1f;&#xff1f; 三.MyBatis 中的结果映射 1. resultType&#xff1a; 2. resultMap&#xff1a; ---问题 ---…

时序预测 | MATLAB实现PSO-KELM粒子群算法优化核极限学习机时间序列预测(含KELM、ELM等对比)

时序预测 | MATLAB实现PSO-KELM粒子群算法优化核极限学习机时间序列预测&#xff08;含KELM、ELM等对比&#xff09; 目录 时序预测 | MATLAB实现PSO-KELM粒子群算法优化核极限学习机时间序列预测&#xff08;含KELM、ELM等对比&#xff09;预测效果基本介绍模型介绍程序设计参…

React Diff算法

文章目录 React Diff算法一、它的作用是什么&#xff1f;二、React的Diff算法1.了解一下什么是调和&#xff1f;2.react的diff算法3.React Diff的三大策略4.tree diff&#xff1a;1、如果DOM节点出现了跨层级操作&#xff0c;Diff会怎么办? 5. component diff&#xff1a;6. e…

使用ELK(ES+Logstash+Filebeat+Kibana)收集nginx的日志

文章目录 Nginx日志格式修改配置logstash收集nginx日志引入Redis收集日志写入redis从redis中读取日志 引入FilebeatFilebeat简介Filebeat安装和配置 配置nginx转发ES和kibanaELK设置账号和密码 书接上回&#xff1a;《ELK中Logstash的基本配置和用法》 Nginx日志格式修改 默认…

Jenkins的流水线详解

来源&#xff1a;u.kubeinfo.cn/ozoxBB 什么是流水线 声明式流水线 Jenkinsfile 的使用 什么是流水线 jenkins 有 2 种流水线分为声明式流水线与脚本化流水线&#xff0c;脚本化流水线是 jenkins 旧版本使用的流水线脚本&#xff0c;新版本 Jenkins 推荐使用声明式流水线。…

ROS2 学习(五)接口,动作

接口 通信双方统一规定好接口。比如图像 img&#xff0c;控制运动的线速度和角速度…… 我们也不用了解具体实现&#xff0c;基本就是了解接口会去用就行。 $ ros2 interface list # 展示所有 interfaces $ ros2 interface show ... # 显示具体一个 interface $ ros2 package…

搭建CFimagehost私人图床,实现公网远程访问的详细指南

文章目录 1.前言2. CFImagehost网站搭建2.1 CFImagehost下载和安装2.2 CFImagehost网页测试2.3 cpolar的安装和注册 3.本地网页发布3.1 Cpolar临时数据隧道3.2 Cpolar稳定隧道&#xff08;云端设置&#xff09;3.3.Cpolar稳定隧道&#xff08;本地设置&#xff09; 4.公网访问测…

Android OkHttp 源码浅析一

演进之路:原生Android框架不好用 ---- HttpUrlConnect 和 Apache HTTPClient 第一版 底层使用HTTPURLConnect 第二版 Square构建 从Android4.4开始 基本使用: val okhttp OkHttpClient()val request Request.Builder().url("http://www.baidu.com").buil…

PMP证书的正确打开方式 get✓

在职场竞争日益激烈的今天&#xff0c;拥有一项专业认证成为了许多人提升自身竞争力的必备条件。而作为项目管理领域的顶级认证&#xff0c;PMP证书备受关注。不过&#xff0c;很多人对于PMP证书的费用颇有顾虑。那么&#xff0c;PMP证书有什么补贴政策呢&#xff1f;下面就为大…

JDBC_1500行学习笔记,真的超级详细!!!

1. ## 为什么要JDBC - java和数据库必要纽带 - 数据库层框架底层原理jdbc概念理解 2. ## jbdb概念理解 - JDBC&#xff1a;Java Datebase Connectivity | Java链接数据库技术的统称&#xff01; 通俗点说&#xff0c;在Java代码中&#xff0c;使用JDBC提供的方法&…

RTSP/Onvif视频服务器EasyNVR安防视频云服务调用接口录像会被自动删除的问题解决方案

EasyNVR安防视频云服务是基于RTSP/Onvif协议接入的视频平台&#xff0c;可支持将接入的视频流进行全平台、全终端的分发&#xff0c;分发的视频流包括RTSP、RTMP、HTTP-FLV、WS-FLV、HLS、WebRTC等。平台丰富灵活的视频能力&#xff0c;可应用在智慧校园、智慧工厂、智慧水利等…

数字流的秩、单词频率(哈希实现)

题目1&#xff1a;数字流的秩 假设你正在读取一串整数。每隔一段时间&#xff0c;你希望能找出数字 x 的秩(小于或等于 x 的值的个数)。请实现数据结构和算法来支持这些操作&#xff0c;也就是说&#xff1a; 实现 track(int x) 方法&#xff0c;每读入一个数字都会调用该方法…

Hugo托管到Github Pages

Github通过其Github Pages服务可以user、project或organization提供免费快速的静态托管&#xff0c;同时使用Github Actions自动化开发工作流和构建。 1.创建Github仓库 可见性为public。 命名为username.github.io&#xff0c;username为你的Github用户名。 2.添加远程仓库…

vue3-ts- element-plus新增组件-过滤

新增组件-所有值为空时过滤 <el-form-item label"家庭成员"><divclass"username-box"v-for"(item, index) in form.namelist":key"index"><div>姓名&#xff1a;<el-input v-model"item.name" placeho…

Docker的革命:容器技术如何重塑软件部署之路

引言 在过去的几年中&#xff0c;容器技术已经从一个小众的概念发展成为软件开发和部署的主流方法。Docker&#xff0c;作为这一变革的先驱&#xff0c;已经深深地影响了我们如何构建、部署和运行应用程序。本文将探讨容器技术的起源&#xff0c;Docker如何崛起并改变了软件部…

Lombok生成的Getter和Setter的名称对于“eMail”或“xAxis”等属性存在大小写转换异常

问题 最新开发中&#xff0c;遇到一个字段映射问题。我们先看问题案例&#xff1a; 明明代码中第二个字母是大写&#xff0c;结果测试接口时发现变成了小写字母。 分析 通过网上查询发现&#xff0c;这属于Lombok的bug。而且早在2015年就有人在GitHub上提出了issues。 Names o…

基于spring boot校园疫情信息管理系统/疫情管理系统

摘要 随着计算机技术&#xff0c;网络技术的迅猛发展&#xff0c;Internet 的不断普及&#xff0c;网络在各个领域里发挥了越来越重要的作用。特别是随着近年人民生活水平不断提高&#xff0c;校园疫情信息管理系统给学校带来了更大的帮助。 由于当前疫情防控形势复杂&#xff…

高性能MySQL实战(三):性能优化

大家好&#xff0c;我是 方圆。这篇主要介绍对慢 SQL 优化的一些手段&#xff0c;而在讲解具体的优化措施之前&#xff0c;我想先对 EXPLAIN 进行介绍&#xff0c;它是我们在分析查询时必要的操作&#xff0c;理解了它输出结果的内容更有利于我们优化 SQL。为了方便大家的阅读&…