页面播放视频关闭
在弹窗(详情)中展示的视频,如果直接关闭弹窗,容易出现视频还在播放的情况,这里推荐加v-if
对组件进行销毁,或者使用ref
进行视频关闭
<video ref="video" />
// 关闭
this.$refs.video[0].pause()
点击事件后的节点操作
问题出现场景:在树状控件的中,点击上级展开下级,但是控件只能点击左侧图标才会展开

于是想到的方式就是点击后找到图标节点进行手动点击事件
// 点击触发事件
function treeClick(e: any) {
if (e.target.parentElement.previousElementSibling) {
e.target.parentElement.previousElementSibling.click()
}
}
涉及知识
fn(e):{
let clickDom = e.currentTarget; // currentTarget 获取绑定点击事件的节点
let currentDom = e.target; // target 获取当前点击节点
let parent = clickDom.parentElement; // parentElement获取绑定事件节点的父节点
let previous = clickDom.previousElementSibling; // previousElementSibling获取绑定事件节点的前一个节点
let previousInner = previous.innerHTML; // 获取绑定事件节点的前一个节点的内容
let next = clickDom.nextElementSibling; // nextElementSibling获取绑定事件节点的后一个节点
let firstChild = clickDom.firstElementChild; // firstElementChild获取绑定事件节点的第一个子节点
let childNodes = clickDom.childNodes; // childNodes获取子节点,包括元素节点和文本节点
let children = clickDom.children; // children获取子节点,只获取元素节点
let childElementCount = clickDom.childElementCount; // childElementCount获取子节点的个数
let lastElementChild = clickDom.lastElementChild; // lastElementChild获取最后一个子节点
let lastChild = clickDom.lastChild; // lastChild获取最后一个子节点,包括元素节点和文本节点
}
常用正则收集
在Vue的信息输入中可能会用到
不能为空
/(?=.{1})/
0-100
/^([0-9]{1,2}|100)$/
表单自动聚焦
<el-input v-model="editData.name" ref="inputFocus"></el-input>
this.$nextTick(() => {
this.$refs['inputFocus'].focus();
});
表单回车事件
<el-form ref="editData" :model="editData"
@keydown.enter.native="editDeal('editData')">