美文网首页
vue的父子传值

vue的父子传值

作者: 帆_44fc | 来源:发表于2020-03-11 00:47 被阅读0次

    1.父向子

    // 父组件
     <Head :btnIcon='btnIcon'></Head>
    // 使用v-bind  简写:
    // 子组件
    // 用props接收
     props: {
          btnIcon: {
            type: String,
            default: ''
          }
     },
    

    2.子向父

    // 子组件
    <el-button @click='btnFn'>点我传参</el-button>
    methods: {
          btnFn() { this.$emit('fn',向父组件传的值msg)}
    }
    // 父组件
     <Head @fn='fnBack' ></Head>
     methods: {
          fnBack: function (msg) {console.log(msg)
          // msg-接收传的值
       }
    }
    

    相关文章

      网友评论

          本文标题:vue的父子传值

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