トーク通信ヴュー（2.0）成分

VUE（2.0）は、それのコンポーネント間の通信方法のvuex枠組みの助けを借りずに、コンポーネントベースの開発モデルは？次は、私が開発中のいくつかの例をまとめたもの。
1.値を渡す親コンポーネントサブアセンブリ（小道具）：

父组件给子组件传值的方式主要是用函数props，具体操作如下

サブコンポーネント部品

  <template>
  
       <div>{{ message }}<div/> 
       
 </template> 
 
 <script>
     export default {
        name="child",
                 props:['message'],   //利用props函数，定义一个“message”变量
         data(){
             
         }
     }
<script/>

親コンポーネント部品：

<template>
    <v-child message="msg"><v-child/>  <!--在这里传值-->
</template>
<script>
    import Child form './child.vue'  
    export default {
        name="parent",
        components:{
            'v-child':Child
        }
        data(){
            return{
                msg:'hello world'
            }
        }
    }
<script/>

2.親コンポーネントサブアセンブリ値（$ EMIT）を渡す値によって渡された親コンポーネントの中心的な考えにサブアセンブリ;質量参加を処理することによって、使用される次のように

サブコンポーネント部品

   <script>
        data(){
            return{
                msg:'123'
            }
        },
        methods:{
          funcName:function(){
            this.$emit("tanslate",this.msg)  /*自定一个事件名tanslate和一个参数this.msg */
          }
        }
    <script/>

親ページのHTML部分：サブページを定義しtanslateイベントによってtanslateTextのカスタムメソッドを呼び出します

<v-child v-on:tanslate="tanslateText"></v-child>

親ページのJS一部：

  methods:{
      tanslateText:function(item){  //参数text是子页面传过来的参数
        console.log(item)   //打印出子页面传过来的参数
      }
    }

3.成分兄弟の間の値の転送

言葉の助けなしVuexは、兄弟や部品何の間の通信を行うために、私たちはコミュニケーションの兄弟コンポーネントを達成するために、既存の知識を使用することができ、中心的な考えは、上記のように、方法の特定のコードを「最初の子がで息子に父、父を渡す」であります同じ、よく！上記は、コンポーネント間の通信の助けなしでvuex

おすすめ