首頁  >  文章  >  web前端  >  vue2.0子元件中怎麼改變父元件中的值 ?

vue2.0子元件中怎麼改變父元件中的值 ?

青灯夜游
青灯夜游轉載
2020-11-05 17:50:002683瀏覽

下面Vue.js教學專欄跟大家介紹vue2.0中子元件透過v-modal改變父元件中值的方法。有一定的參考價值,有需要的朋友可以參考一下,希望對大家有幫助。

vue2.0子元件中怎麼改變父元件中的值 ?

vue2.0中子元件透過v-modal改變父元件中的值

父元件程式碼:

<template lang="pug">
  p
    p this is father
    child(v-model="data")
</template>
<script>
  import child from "./childrenS.vue";
  export default{
    data(){
      return {
        data: [1, 2, 3]
      }
    },
    components: {
      child
    },
    watch: {
      data(n, o){
        console.log(n,o)
      }
    }
  }
</script>

  子元件程式碼:

<template lang="pug">
  p this is child
</template>
<script>
  export default{
      created(){
          this.$emit("input",[4,5,6])
      }
  }
</script>

  效果如下:

相關推薦:

#2020年前端vue面試題大匯總(附答案)

vue教學推薦:2020最新的5個vue.js影片教學精選

#更多程式相關知識,請造訪:程式設計學習網站! !

以上是vue2.0子元件中怎麼改變父元件中的值 ?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文轉載於:segmentfault.com。如有侵權,請聯絡admin@php.cn刪除