vue once事件,vue beforedestroy 没有触发
这篇文章主要介绍了某视频剪辑软件使用一次修饰符，使事件只能触发一次问题，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
目录
一次修饰符，使事件只能触发一次某视频剪辑软件事件修饰符（一次：上一次：停止)注释说的很详细
once修饰符，使事件只能触发一次
多个修饰符可以同步使用
！-定义某视频剪辑软件的操作对象-
div id=应用程序
！-使用自己修饰符点击标签自身时才会执行事件-
！-使用一次修饰符使事件只能触发一次-
！-多个修饰符可以同时使用-
div class= inner @ click。自我。once= div click
输入类型=按钮值=点击@click=butClick
/div
/div
！-导入vue.js -
脚本src= ./vue。js /脚本
脚本
//创建一个某视频剪辑软件实例
var vm=new Vue({
el:#app ，//指定实例控制的数字正射影像图元素
数据：{ //存储页面数据
},
方法：{ //在此处定义实例可用的所有方法
divClick(){
console.log(div点击事件)
},
butClick(){
console.log(按钮点击事件)
}
}
})
/脚本
vue事件修饰符(once:prev:stop)
附有同一文件夹下的超文本标记语言文件、js文件和钢性铸铁文件
注释说的很详细
index.html的代码
！声明文档类型
html lang=en
头
meta charset=UTF-8
标题vue/标题
link rel=样式表 href= style。CSS rel=外部无跟随
脚本src= https://cdn。jsdelivr。net/NPM/vue /脚本
/头
身体
！- vue应用程序是根容器-
div id=vue-app
氕事件/h1
button @click.once=add(1)单击涨一岁/按钮
按钮v-on:click=减去(1)单击减一岁/按钮
button @dblclick=add(10)双击涨十岁/按钮
按钮v-on:dblclick=subtract(10)双击减十岁/按钮
我的年龄是{ {年龄}}/p
div id= canvas v-on:mousemove= update xy
{{x}}，{{y}} -
停止移动/span
英国铁路公司
span v-on:mousemove.stop= 停止移动/span
/div
一个v-on:click= alert() href= https://博客。csdn。net/QQ _ 40647912 rel=外部无关注 rel=外部无关注百度/a
英国铁路公司
一个v-on:点击。阻止= alert() href= https://博客。csdn。net/QQ _ 40647912 rel=外部无关注 rel=外部无关注百度/a
/div
/div
脚本src=app.js/script
/body
/html
app.js的代码
//实例化VUE对象
新Vue({
el:#vue-app ，
//仅限于在vue-app容器下
数据：{
年龄：30,
x:0，
y:0
},
方法：{
添加：功能（公司){
时代公司
},
减法：函数(十二月){
这个。年龄-=十二月；
},
updateXY:函数（事件){
这个。x=事件。offsetx
这个。y=事件。小康；
},
停止移动：函数（事件){
事件。停止传播()；
},
预警：函数(){
alert( hello world！);
}
}
});
style.css代码
#画布{
宽度：600像素
填充：200像素20像素
文本对齐：居中；
边框：1px纯色# 333;
}
以上为个人经验，希望能给大家一个参考，也希望大家多多支持我们。
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。