序言
$nextTick是什么？
解决什么问题一、数据更新、视图没有更新
怎么用
this.$nextTick(()=>{ //把要执行的方法用this.$nextTick包起来 })
$nextTick就是用来知道什么时候DOM更新完成的
vue如何获取dom
先给标签设置一个ref值，再通过this.$refs.domName获取，例如：
<div ref="test"></div>
const dom = this.$refs.test
addEventListener、removeEventListener
mounted() { // 注册滚动事件，在滚动的时候如果cascader打开，就关闭它 const ele = document.getElementsByClassName(‘main‘)[0]; if (ele) { ele.addEventListener(‘scroll‘, this.listenScroll, { passive: true, }); } }, beforeDestroy() { // 移除滚动事件监听 const ele = document.getElementsByClassName(‘main‘)[0]; if (ele) { ele.removeEventListener(‘scroll‘, this.listenScroll, { passive: true, }); } },
vue中的ref和$refs
ref有三种用法：
1、ref 加在普通的元素上，用this.ref.name 获取到的是dom元素
2、ref 加在子组件上，用this.ref.name 获取到的是组件实例，可以使用组件的所有方法。
3、如何利用 v-for 和 ref 获取一组数组或者dom 节点
https://www.cnblogs.com/xumqfaith/p/7743387.html
<div class="search-form clearfix" @keydown="bindEnter($event)">
// 绑定enter事件
bindEnter(e) {
this.$enterSearch(e, this.search);
}
cookie
if (this.$cookies.get("groupId")) {
this.$cookies.remove("groupId");
}
_this.$cookies.set("groupId", groupId, 31 * 24 * 60 * 60);
_this.$cookies.set("hotelId", hotelId, 31 * 24 * 60 * 60)
// 保存酒店名称
const localSrorage = window.localStorage;
localSrorage.hotelName = hotelName;
filters
<td>{{ item.star | format_star }}</td>
filters: { format_star(str) { switch (str) { case "FiveStar": return "五星"; break; case "QuasiFiveStar": return "准五星"; break; case "FourStar": return "四星"; break; case "QuasiFourStar": return "准四星"; break; case "ThreeStar": return "三星"; break; case "QuasiThreeStar": return "准三星"; break; case "Economical": return "经济型"; break; default: return "请选择"; } }
async
async function searchPermissions() {
scope
const { row } = scope;
Vue.nextTick()用于延迟执行一段代码。
vue 中的const {XXX } =this 的作用效果
样例1：
const { xxx } = this.state;
上面的写法是es6的写法，其实就相当于：
const xxx = this.state.xxx
样例2：
const {comment,index,deleteComment} = this
上面的这句话是一个简写，最终的含义相当于
const comment = this.comment
const index = this.index
const deleteComment = this.deleteComment