正確的方式來覆蓋Vue.js中的屬性和方法？

Question

在Vue.js中覆蓋使用mixins的方法的正確方法是什麼？我知道你可以使用mixin來模擬繼承，但是假設你想擴展一些道具，但是不能完全覆蓋整個道具的價值。

比如我有一個baseCell，但我也需要有這將是類似的，但功能不同的<td> S和<th> S三個分量，所以我創建使用baseCell作爲混入兩個額外的組件。

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中，您可以使用自定義選項合併策略來實現您想要的功能。請注意，該策略適用於所有mixin。

一個例子可以在這裏找到在實況： https://vuejs.org/v2/guide/mixins.html#Custom-Option-Merge-Strategies