父组件

<v-sub @returnDate=returnDate :backGround=backGround></v-sub>

import vSub from "../../../components/v-sub.vue"
export default {
components:{
vSub
},
data() {
return {
backGround:"#000"
}
},
methods: {
returnDate(e){
console.log("接收到的值==>>" e)
}
}
}
<device ref="device" :stoId="storeId" v-show="active == 'device'">
</device>
<battery ref="battery" :stoId="storeId" v-show="active == 'battery'">
</battery> import device from './components/device.vue'
import battery from './components/battery.vue'
export default {
components: {
device,
battery
},
data() {
return {
storeId: null, // 参数storeId
active: 'device' // 切换tab
}
},

子组件

<template>
<view class="content" :style="[{background:backGround}]">
<button @tap="passValue">点击传值</button>
</view>
</template> <script>
export default {
props:{
backGround:{
type:String,
default:"#fff"
}
},
methods:{
passValue(){
this.$emit("returnDate","yoyoyo")
}
}
}
</script> <style>
.content{
width: 400upx;
height: 400upx;
}
</style>

子类接收父类的数据,就会用到props

子组件给父组件传值首先在子类组件定义事件

父组件:

子组件

子组件

父组件

若本号内容有做得不到位的地方(比如:涉及版权或其他问题),请及时联系我们进行整改即可,会在第一时间进行处理。

请点赞!因为你们的赞同/鼓励是我写作的最大动力!

欢迎关注达达的简书!

这是一个有质量,有态度的博客

uniapp 组件传参的更多相关文章

  1. Vue 子组件向父组件传参

    直接上代码 <body> <div id="counter-event-example"> <p>{{ total }}</p> & ...

  2. vue 父子组件传参

    父向子组件传参 例子:App.vue为父,引入componetA组件之后,则可以在template中使用标签(注意驼峰写法要改成componet-a写法,因为html对大小写不敏感,component ...

  3. Vue(小案例_vue+axios仿手机app)_公共组件(路由组件传参)

    一.前言                    1.公共轮播图的实现                    2.组件传参,公共组件的实现 二.主要内容 1.公共轮播图的实现 (1)分析:当渲染不同的轮 ...

  4. Vue-admin工作整理(四):路由组件传参

    路由组件传参:如果在一个页面中,需要根据路由去获得参数,去对页面进行一些逻辑处理,首先可以通过this.$router来获取路由实例的参数,这样页面组件和路由就进行了耦合,为了进行分离,更大程度复用, ...

  5. VueJs(11)---vue-router(命名路由,命名视图,重定向别名,路由组件传参)

    vue-router 上篇文章讲了第一篇vue-router相关文章,文章地址:VueJs(10)---vue-router(进阶1) 一.命名路由 有时候,通过一个名称来标识一个路由显得更方便一些, ...

  6. vue子组件传参给父组件

    关于父组件传参给子组件,可以看我另一篇文章 教程开始: 我们要实现的效果是:在子组件的Input框输入,父组件中实时更新显示.(也就是把子组件中的数据传给父组件) 一.子组件代码 template部分 ...

  7. vue父组件传参给子组件

    其实组件之间传参有很多种方法: 1.通过本地存储 2.使用vuex状态管理 今天记录一下第三种方法 1.首页我们先创建一个项目(创建项目自行百度) 2.打开项目,在components文件夹下新建一个 ...

  8. 【vue】父向子组件传参、子组件向父传参

    1.父向子组件传参 App.vue为父,引入componetA组件之后,则可以在App.vue中使用标签(注意驼峰写法要改成componet-a写法,因为html对大小写不敏感,componenta与 ...

  9. vue组件传参

    一.父子组件的定义 负值组件的定义有两种,我称为常规父子组件和特殊父子组件. 1.1.常规父子组件 将其他组件以import引入用自定义标签接收,在当前组件中component里注册该标签,页面上可以 ...

随机推荐

  1. java.net.URLEncoder对中文的编码和解码

    // java.net.URLEncoder对中文的编码和解码String str = URLEncoder.encode("测试字符串", "utf-8"); ...

  2. Serverless

    一.介绍 是指依赖于第三方应用程序或服务来管理服务器端逻辑的应用程序. 此类应用程序是基于云的数据库(如Google Firebase)或身份验证服务. 无服务器也意味着开发为事件触发的代码,并且在无 ...

  3. CSS揭秘-半透明边框与多重边框

    场景一: 实现半透明边框: 由于CSS样式的默认行为,背景色的渲染范围是 content+padding+border. 半透明边框被主调色影响, 实现的效果为   解决方案: 使用backgroun ...

  4. Beego 学习笔记一:环境的配置

    Beego 环境的配置 1>     下载go,并安装.下载地址是: https://golang.org/dl/.最好选择这部分的最新的下载安装 2>     配置环境变量(若是没有配置 ...

  5. underscore_1: map()

    map()是underscore.js中一个处理数组和对象的方法. params: 1. array || obj 2. callback 3. content 上下文指向 使用: var obj = ...

  6. 安全SECUERITY单词SECUERITY证券

    中文名:证券业 外文名:secuerity 含义:指从事证券发行和交易服务 性质:证券市场的基本组成要素 组成:证券交易所.证券公司 目录 1 证券评级 2 证券定义 ? 涵义 ? 内容 ? 分类 ? ...

  7. 配置集成测试环境 phpstudy

    phpStudy是一个PHP调试环境的程序集成包,该程序包集成最新的Apache+PHP+MySQL+phpMyAdmin+ZendOptimizer,一次性安装,无须配置即可使用,是非常方便.好用的 ...

  8. Java变量常量声明和定义

    一.常量和变量 1.常量变量定义 在程序中存在大量的数据来代表程序的状态,其中有些数据在程序的运行过程中值会发生改变,有些数据在程序运行过程中值不能发生改变,这些数据在程序中分别被叫做变量和常量. 2 ...

  9. Odoo启动运行参数(script运行参数,不是运行配置文件)

    转载请注明原文地址:https://www.cnblogs.com/ygj0930/p/10826315.html 一:启动选项用在哪里 如果你是用Pycharm进行odoo二次开发的话,可以通过 R ...

  10. Linux多网卡绑定(bond)及网络组(team)

    Linux多网卡绑定(bond)及网络组(team)   很多时候,由于生产环境业务的特殊需求,我们需要对服务器的物理网卡实施特殊的配置,从而来满足不同业务场景下对服务器网络的特殊性要求.如高并发的网 ...