Shulou(Shulou.com)06/02 Report--

This article shows you how to solve the problem of vue change blocking default events. The content is concise and easy to understand. It will definitely brighten your eyes. I hope you can gain something through the detailed introduction of this article.

Background: there is a quantity increase or decrease option inside the check box, and both are change events. When internal increase or decrease events are triggered, external check change events are also triggered, which is not a good experience.

Use event @ click.stop.native.prevent solution (either @ click.stop or @ click.prevent is invalid, direct error reporting will not stop the event)

Props_name: {{item.props_name}} Type: {{item.name_suffix}} quantity: ×

Effect.

The change events of the green box and the orange box in the figure will not interfere with each other.

No one can be simple all the way to the end, but remember, don't forget who you were at first!

Why to use VueVue is a friendly, multi-purpose and high-performance JavaScript framework, using vue can create a more maintainable and testable code base, Vue allows you to split a web page into reusable components, each component contains its own HTML, CSS, JavaScript, to render the corresponding place in the web page, so more and more front-end developers use vue.

The above content is how to solve the problem of vue change blocking default events. Have you learned the knowledge or skills? If you want to learn more skills or enrich your knowledge reserve, you are welcome to follow the industry information channel.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.