uniapp父子组件之间传值


父组件

<template>
  <view class="parent-comm">
    <itemcomm :msg="list"></itemcomm> //子组件   :msg="list" 这个是传值给子组件,msg字段可自己取名,但子组件上必须和父组件上的统一。
  </view>
</template>

<script>
  import itemcomm from './test0301.vue' //子组件
  export default {
    data() {
      return {
        list: {
          "a": 100,
          "b": 200,
          "c": 300
        }
      }
    },
    components: {
      itemcomm //子组件
    },
    methods: {

    }
  }
</script>

<style>
</style>

子组件

<template>
  <view class="node-comm">
    <text>{{msg.a}}</text>//显示父组件传过来的值
    <text>{{msg.b}}</text>//显示父组件传过来的值
    <text>{{msg.c}}</text>//显示父组件传过来的值
  </view>
</template>

<script>
  export default{
    props:{
      msg:{  //接收父组件传过来的值
        type:Object,
        default:{}
      }
    }  
  }
</script>

<style>
</style>


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM