美文网首页
Uniapp兄弟组件传值

Uniapp兄弟组件传值

作者: 锋叔 | 来源:发表于2021-10-28 14:34 被阅读0次

兄弟组件a.vue和b.vue之间的传值方式

a.vue
<template>
    <view class="a">
        <text>我是A组件</text>
        <button type="default" @click="numAdd">修改B组件的值</button>
        num: {{num}}
    </view>
</template>

<script>
    export default {
        data() {
            return {
                num: 0
            }
        },
        methods: {
            numAdd() {
                uni.$emit("numAdd", 10)
                this.num += 10
            }
        }
    }
</script>
b.vue
<template>
    <view style="height: 50px;">
        <text>我是B组件: {{num}}</text>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                num: 0
            }
        },
        created() {
            uni.$on('numAdd', n => {
                this.num += n
            })
        },
        methods: {
            
        }
    }
</script>

相关文章

  • Uniapp兄弟组件传值

    兄弟组件a.vue和b.vue之间的传值方式 a.vue b.vue

  • angular组件之间的传值

    父子组件传值 父组件给子组件传值通过属性绑定的方式 子组件通过发送是事件给父组件传值 兄弟组件相互传值 兄弟组件通...

  • 组件之间的传值

    组件之间的传值,包括父子组件传值,兄弟组件之间的传值,其中父子组件包括父组件向子组件传值和子组件向父组件传值,现在...

  • Vue.js 父子组件传值 . 兄弟组件传值

    概述 vue中组件之间的传值传值情况主要有以下三种 父组件向子组件传值子组件向父组件传值兄弟组件之间相互传值或者是...

  • uniapp 组件传值

    组件传值 在 组件A 中,通过 uni.$emit('事件名称',参数) 发送事件 在 组件B 中,通过 uni....

  • uni-app通信方式

    一,组件间传值包括下面三种情况: 1,父组件给子组件传值 2,子组件给父组件传值 3,兄弟组件通讯 二 代码1 父...

  • 组件通信

    vue传值可分为父子之间传值、兄弟组件之间传值、跨代组件之间传值 1.父子之间传值:可以使用$emit/props...

  • vuex最详细完整的使用用法

    为什么使用vuex? vuex主要是是做数据交互,父子组件传值可以很容易办到,但是兄弟组件间传值(兄弟组件下又有父...

  • Vue组件之间的传值

    Vue父子组件之间的传值(props)兄弟组件 VUEX

  • Day5 拾遗 emit

    vue emit多个参数利用arguments来获取子组件传值或者兄弟组件通过emit传值, 通过argument...

网友评论

      本文标题:Uniapp兄弟组件传值

      本文链接:https://www.haomeiwen.com/subject/cqdvaltx.html