vue2.0如何把子組件的數(shù)據(jù)傳給父組件(推薦)

在父組件 App.vue 中引用子組件 A.vue，把 A中的數(shù)據(jù)傳給App.

創(chuàng)新互聯(lián)是一家專業(yè)提供青川企業(yè)網(wǎng)站建設,專注與網(wǎng)站設計、成都做網(wǎng)站、html5、小程序制作等業(yè)務。10年已為青川眾多企業(yè)、政府機構等服務。創(chuàng)新互聯(lián)專業(yè)網(wǎng)站設計公司優(yōu)惠進行中。

ps:沒看父組件傳給子組件的先看看去。

1、代碼

子組件 A.vue

<template>
 <div>
 <h4>這里是子組件的內容</h4>
 <button v-on:click="spot">點一下就傳</button>
 </div>
</template>

<script>
 export default {
 methods: {
  spot: function() {
  // 與父組件通信一定要加上這句話
  this.$emit("spot", '我是子組件傳給父組件的內容就我。。')
  }
 }
 }
</script>

父組件 App.vue

<template>
 <div id="app">
 <!-- 父組件直接用 v-on 來監(jiān)聽子組件觸發(fā)的事件。 -->
 <!-- 需跟子組件中的$emit組合使用 -->
 <A v-on:spot="spot"/>
 </div>
</template>

<script>
import A from './components/A'
export default {
 name: 'App',
 components: {
 A
 },
 methods:{
 spot:function(data){
  console.log(data)
 }
 }
}
</script>

2、總結

1、$emit很重要，使用 $emit(事件名，參數(shù)) 觸發(fā)事件

2、子組件需要某種方式來觸發(fā)自定義事件

3、父組件直接用 v-on 來監(jiān)聽子組件觸發(fā)的事件，需跟子組件中的$emit組合使用。

3、效果

vue2.0 如何把子組件的數(shù)據(jù)傳給父組件(推薦)

總結

以上所述是小編給大家介紹的vue2.0 如何把子組件的數(shù)據(jù)傳給父組件(推薦)，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復大家的。在此也非常感謝大家對創(chuàng)新互聯(lián)網(wǎng)站的支持！

當前文章：vue2.0如何把子組件的數(shù)據(jù)傳給父組件(推薦)
當前路徑：http://chinadenli.net/article26/ppgscg.html

成都網(wǎng)站建設公司_創(chuàng)新互聯(lián)，為您提供域名注冊、搜索引擎優(yōu)化、虛擬主機、微信小程序、網(wǎng)站排名、建站公司

聲明：本網(wǎng)站發(fā)布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經(jīng)允許不得轉載，或轉載時需注明來源：創(chuàng)新互聯(lián)

猜你還喜歡下面的內容

欧美一区二区三区老妇人-欧美做爰猛烈大尺度电-99久久夜色精品国产亚洲a-亚洲福利视频一区二区

vue2.0如何把子組件的數(shù)據(jù)傳給父組件(推薦)