Vue的mixins(混入)是一種非常靈活的方式,用于分發(fā)可復(fù)用功能到Vue組件中。mixins是一個(gè)JavaScript對(duì)象,可以包含組件中的任意功能選項(xiàng),如data、components、methods、created、computed等。通過(guò)將公用的功能以對(duì)象的方式傳入mixins選項(xiàng)中,組件使用mixins對(duì)象后,mixins對(duì)象的選項(xiàng)將被擴(kuò)展到組件本身的選項(xiàng)中,從而提高代碼的重用性和可維護(hù)性。
使用方法如下:
注意事項(xiàng):
示例代碼:
// mixins.js export default { created() { console.log('嘎嘎') }, data() { return { title: '標(biāo)題' } }, methods: { sayHi() { console.log('你好') } } } // MyComponent.vue import mixins from '@/mixins/mixins' export default { mixins: [mixins], // 其他組件選項(xiàng)... }
在MyComponent組件中,可以通過(guò)this.title和this.sayHi()來(lái)訪問(wèn)混入的數(shù)據(jù)和方法。