vue父元件和子元件傳值

weixin_33924312發表於2017-12-06

父元件向子元件傳值通過在子元件新增props屬性;原則上子元件不能向父元件傳值,但可以通過emit事件傳值,後邊也可以通過vuex


7243642-62491b8287f92f01.png
image.png

1、父元件向子元件傳值

通過在子元件寫

props:["num"]//num是父元件要傳過來的變數

2、子元件向父元件傳值

通過在子元件呼叫emit事件,把方法寫在父元件

//子元件
 methods:{
    increment(){
       this.$emit("incre");//呼叫父元件的increment方法
    },
    decrement(){
      this.$emit("decre")
    }
//父元件

    <Counter :num="num" @incre="increment" @decre="decrement"></Counter>
 methods:{
    increment(){
      this.num++;
    },
    decrement(){
      this.num--;
    }
  }

相關文章