Mouseover does not work on q-btn

[anonimo]

I’m making a small customization of q-btn for my personal use and I need to use the mouseover event, but for some reason it does not work on q-btn, any suggestions?

<template>
<q-btn
round
class=“btnWave”
:style="{
‘border’: border,
‘color’: color,
‘background-color’: color
}"
@mouseover=“teste($event)”
>
<icon :local.boolean=“true” name=“mah-ambulance”/>
</q-btn>
</template>

<script>
import css from ‘…/assets/js/cssDefault.js’
import {
QBtn
} from ‘quasar’
import Icon from ‘./icon.vue’
export default{
components: {
QBtn,
Icon
},
props: {
big: {
type: Boolean(),
required: false,
default: false
},
small: {
type: Boolean(),
required: false,
default: false
},
color: {
type: String(),
required: true,
default: css.color.primary
},
bgColor: {
type: String(),
required: true,
default: css.color.secondary
}
},
mounted: function () {
this.border = ($(’.btnWave’).width() / 2) + ‘px ’ + this.bgColor + ’ solid!important’
},
data: function () {
return {
border: ‘0px ’ + this.bgColor + ’ solid!important’
}
},
methods: {
teste (event) {
console.log(‘over’)
/* $(event.target).addClass(‘hover’)
$(’.hover’).css({
borderWidth: ‘1px’,
color: this.bgColor
}) */
}
}
}
</script>

<style lang=“stylus”>
@import ‘~src/themes/app.variables.styl’;
.btnWave{
position: relative;
cursor: default;
transition: border 0.3s ease, color 0.5s ease ;
}
.btnWave>.q-btn-inner{
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
</style>

[anonimo]

solved with jquery, if you have any suggestion with vue send

[BigAppear]

Please format your code (4 spaces before each line), it’s unreadable

[mmakrzem]

Does anyone have suggestions on how to get mouseover and mouseout working on q-btn objects? Those events do not get fired at all. I don’t want to include jQuery just to solve this problem.

[mmakrzem]

Thanks Razvan Stoenescu, The solution to the problem is to use @mouseover.native
see: https://vuejs.org/v2/guide/migration.html#Listening-for-Native-Events-on-Components-with-v-on-changed