vue中mixins簡單使用

創建一個共用的mixins數據

<script>
export default {
	name: 'myMixins'，
	data() {
		return {
			name: '這是公用的名稱'，
			clickCount: '這是點擊的次數'
		}
	},
	methods: {
	//點擊按鈕記數
	onClickBtn: function () {
		this.clickCount++
	}
	mounted() {
		console.log('這是一個按鈕點擊計數的mixins')
	}
	}
}
</script>

在組件中引入並使用

import mixinsBtn from '@/mixins';
export default {
	name:'Btn1',
	mixins: [mixinsBtn ],
	data: () {
		return {
			name:'這會覆蓋mixins裏面的name'
	}，
	methods: {
	//點擊按鈕記數
	onClickBtn: function () {
		this.clickCount += 2
		console.log('這將會覆蓋mixins裏面的方法onClickBtn')
	},
	mounted() {
		console.log('這將會合並mixins裏面mounted方法內容')
	}
}
}