Vue.jsのプロパティとメソッドをオーバーライドする適切な方法は？

Question

Vue.jsでmixinsを使用してメソッドをオーバーライドする適切な方法は何ですか？私はミックスインを使って継承を模擬することができると知っていますが、いくつかの小道具を拡張したいが、小道具全体の価値を完全に上書きするわけではないとしましょう。

たとえば、私はbaseCellを持っていますが、同様の機能を持つが、<td>と<th>のために機能が異なる必要があるので、mixinとしてbaseCellを使用する2つの追加コンポーネントを作成します。

var baseCell = { 
    ... 
    props: { 
    ... 
    initWrapper: { 
     type: String, 
     default: 'td' 
    }, 
    ... 
    }, 
    methods: {..} 
}; 

コンポーネントでは、すべての値が完全に上書きされます。

Vue.component('tableHeader', { 
    mixins: [baseCell], 
    props: { 
    initWrapper: { 
     default: 'th' 
    } 
    } 
} 

私は、プロパティをマージするの溶液を作ってみたが、それは一種のハックようだ、と私はよりよい解決策があるかどうかはわかりません。これにより

Vue.component('tableHeader', { 
    mixins: [baseCell], 
    props: Object.assign({}, baseCell.props, { 
    initWrapper: { 
     default: 'th' 
    } 
    }) 
}); 

、私はbaseCellの小道具を保持するが、オブジェクト内のいくつかの定義されたものが渡されます。

Answer 1

Vue> 2.2では、カスタムオプションのマージ戦略を使用して、必要なものを達成することができます。この戦略はすべてのミックスインに適用されます。

例はドキュメンタリーではここで見つけることができます： https://vuejs.org/v2/guide/mixins.html#Custom-Option-Merge-Strategies