zoukankan      html  css  js  c++  java
  • vue子父组件通信

    之前在用vue写子父组件通信的时候,老是遇到问题!!!

    子组件传值给父组件:
      子组件:通过emit方法给父组件传值,这里的upparent是父组件要定义的方法   
      模板:
        <div v-on:click="switchViewBtn">切换视图</div>
      在data中定义:switchStatus = true;
      方法:
        switchViewBtn(){
          let that=this;
          this.$emit("parentView",that.switchStatus);
        },
      父组件:模板: 
        <div @parentView="changeView" :msg="msg"></div>
      方法:
      changeView(msg){
        this.switchStatus = msg;
      }
      这样就可以将子组件的值传给父组件了。
     
    父组件传值给子组件:
      父组件:模板:
      <div :name="name">切换视图</div>
      在data中赋值:
        export default {
          data() {
            return {
              data:‘zy’
             }
          }
        }
     
    子组件中接受代码:
      export default {
        data() {
          return {
            data:‘zy’
            }
          },
        props:[
           'name'
        ]
      }
  • 相关阅读:
    多媒体笔记
    全部MIME类型列表
    PHP 标记 <?= <?php
    js渐显文字 时间间隔
    ThinkPHP5 隐式传参的获取方法
    [php] Fatal error: Class Exception not found in
    ionic2 The --v1 and --v2 flags have been removed.
    java POI导出excel,合并单元格边框消失
    swagger暴露程序接口文档
    SpringBoot整合Mybatis
  • 原文地址:https://www.cnblogs.com/sunflower-zy/p/7136111.html
Copyright © 2011-2022 走看看