Mixins實例

• Mixins為一個Object可以讓元件共用Mixins中的功能及data

  Mixins主要處理重複事件(事件資料不太重要)

// Mixins/Test.js

export default {
	data () {
		return {
		// 共用 data
		}	
	},
	methods: {
		// 共用方法
	}
}

透過以下方法引入到要使用mixins的元件中，該元件即可使用mixins中定義的data及function

// App.js (script裡)
// 要使用mixins的元件

import Test from '@/mixins/Test'

export default {
	 mixins: [Test],
}

以下範例功能為: 傳入自訂API 限定在 60秒內不能重複 post API

• 仔細觀看下方code會發現Mixins雖然方便，但使用起來不嚴謹，也不容易閱讀
• react不推崇使用Mixins，react使用HOC,render props

https://codesandbox.io/s/nervous-sanderson-9nu94?file=/src/mixins/CustomCode.js

computed閉包傳參數方法

<template>
	<div>
		<div :class="{'actived': isShowClass(true)}" ></div>
	</div>
</template>

computed: {
	isShowClass () {
		return (value) => {
			return value 
		}
	}
}