[Vue] 避免快速連點

不想讓 user 快速連點觸發 API 的按鈕

<button

:disabled="disabledTrigger"

@click="preventDoubleClick()"

>

click!

</button>

data () {

return {

disabledTrigger: false,

}

},

methods: {

preventDoubleClick () {

let i = 1

this.disabledTrigger = true

const timer = setInterval(() => {

i = i + 1

if (i > 1) {

this.disabledTrigger = false

i = 1

clearInterval(timer)

}

}, 250)

} }

[Vue] vue-router 進入頁面若無帶 query 參數帶入指定 query

情境： 在任意網頁甚至主頁點選進入 /products
會沒有指定 query ( 如 /products?type=food ) 只進入 /products
使其固定帶上 query 方式如下

{

name: 'products',

path: `${rootPath}/products`,

component: () => import(/* webpackChunkName: "courses" */ '../pages/products/').then(m => m.default || m),

beforeEnter: (to, from, next) => {

if (!to.query.type) {

next({

path: to.path,

query: { type: 'food' }

})

}

next()

}

},