CODEWITHSUNDEEP
vue.jsvuetify.jsv-btn
domaci_a_nas
domaci_a_nas

Reputation: 268

Extending vuetify v-btn component, adding custom click event

I am trying to create component which would extend v-btn in such a way that every time I click a button, it should emit short beep, and disable the button for 5 seconds.

It would be ideal for the button to change color while disabled.

This is a problem, since color is a property, and I can't overwrite it's value...

Also, when I try to invoke super.click(e), I get an error.

You can check example here: https://codesandbox.io/s/elegant-glade-pnhqx

Upvotes: 0

Views: 1339

Answers (1)

Renaud
Renaud

Reputation: 1300

Your Btn component should just "use" v-btn rather than extending it.

v-bind="$attrs" is to copy any <btn>'s attribute onto <v-btn>. @click event is captured and reemited as-is after doing what needs to be done

See https://codesandbox.io/s/immutable-paper-w1wck?file=/src/components/Btn.vue:41-56

Upvotes: 1

Related Questions