Why doesn't Vue's event modifier .stop work on Firefox? How to solve it?

<button :id="item.id" @click="intoDetail(item.id)">
    
    <!-- .stop -->
    <input type="radio" name="liftItem" @click.stop="popData.liftId=item.id
</button>

as in the code above, when I click < input > on Chrome, the browser only executes the popData.liftId=item.id
line of code, while on Firefox, it executes the intoDetail () method. Why? Is there any way to prevent click events from bubbling to < button > and only execute popData.liftId=item.id ?

add:
I find that it doesn"t seem to be the event bubbling problem. If you right-click < input > on Chrome, you will locate it < input > itself, while on Firefox you will only locate < button > , but the z-index of < input > remains unchanged.

Firefox vue.js

Mar.02,2021

event will fail in fireFox, so event.stop; will not be executed
put popData.liftId=item.id in a function defined by method,
example:

getId(e) {
 var e = window.event || e
 e.stopPropagation()
 popData.liftId=item.id
}
// :
 @click="getId($event)"

Previous: Unable to read the removable hard disk of Ubuntu system when booting under mac

Next: What if tp5 deploys error 404 on linux's nginx server?