VUE中性子と親コンポーネントのデータ同期方式

カスタムコンポーネント

サブアセンブリ、パッケージの特性を達成するために親コンポーネントを呼び出すためのキーを容易にするために、

<templete>
	<div>{{ innerChildCompoentData }}</div>
</templete>
export default {
  name: 'ChildComponent',
  props: {
    childCompoentData: {
      type: Object,
      default() {
        return {}
      }
    }
  },
  data() {
    return {}
  },
  watch: {
    childCompoentData: {
      handler(val) {
        this.innerChildCompoentData = val
      },
      deep: true
    },
    innerChildCompoentData: {
      handler(val) {
        this.$emit('update:childCompoentData', val)
      },
      deep: true,
      immediate: true
    }
  }
}

親コンポーネントでは、あなただけの結合特性を双方向を実現することができ、コール同期する必要がありますが、現在の実装ので、これはおそらく最良の解決策ではなく、インターネットの大物が共有への意志がないからです。

<ChildComponent :childCompoentData.sync="parentData" />
リリース3元の記事 ウォンの賞賛0 ビュー167

おすすめ

転載: blog.csdn.net/m0_46059204/article/details/104333087