Vue.js のコンポーネント間の通信

今回は、Vue.js コンポーネント間の通信について説明します。Vue.js を使用してコンポーネント間で通信する場合の 注意事項 について、実際のケースを見てみましょう。

サブコンポーネントに番号=99を渡します

<template>
  <div id="myapp">
    <com-a number=99></com-a>
  </div></template><script>
  import ComA from &#39;./components/a.vue&#39;
  export default {    components: {
      ComA
    }
  }</script>

サブコンポーネント内で a.vue

<template>
  <div class="hello">
    {{hello}}
    {{ number }}  </div></template><script>
  export default {//    声明number属性//    未指定类型//    props: [&#39;number&#39;],//    指定类型
    props: {      &#39;number&#39;: [Number, String]
    },
    data () {      return {        hello: &#39;I am componnet a&#39;
      }
    }
  }</script>

実行効果

この記事の事例を読んで、方法をマスターしたと思います。さらに興味深い内容については、php Chinese Net

その他の関連記事に注目してください。

推奨読書:

Vue.jsのVueタグ属性と条件付きレンダリング

Vue.jsの計算された属性とデータモニタリング

以上がVue.js のコンポーネント間の通信の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。