本文實例講述了vue實現組件之間傳值功能。分享給大家供大家參考，具體如下：

slot標簽：

想向封裝好結構的組件中插入內容，需要借助<slot></slot>

在組件之中進行關聯：如

模板中：

<slot name='txt'></slot>

組件調用中：

<p slot='txt'></p>

注：如果只有slot上面每一定義name屬性，則只能有一個slot

<div class='box'>  <com>    <p slot='txt'></p>  </com></div><template id="c">  <div>    <slot name="txt"></slot>  </div></template>

Vue.component('com',{  template:"#c"})

父組件向子組件傳值：props

父組件：

<template>  <child :parent-msg='a'></child></template>

子組件：

child：{  template：'#chi'  props：['parentMsg']}

子組件向父組件的傳值：

vue只運行數據的單選傳遞，在子組件向父組件的傳值中，需要事件觸發

子組件：

<template>  <div @click="up"></div></template>

methods:{ up(){  this.$emit('fn','msg') // 主動觸發fn方法，msg是需要傳遞的數據 }}

父組件：

<div>  <child @fn="getval"></child></div>

methods:{  getval(msg){ // msg接收到的數據    this.msg=msg  }}

希望本文所述對大家vue.js程序設計有所幫助。