前端项目小bug总结

1. 如果遇到多个路由跳转但是生命周期没有执行的原因：
   应该是你这几个路由的组件复用了。使用相同的组件，是不会重新渲染的，不会销毁组件再创建，而会直接复用组件，这样会更高效。为了解决这个问题可以通过监听路由然后去按需求变化。

2. 在vue项目里获取DOM元素
   这两种只能获取当前
   this.$refs，直接操作DOM元素，跳过虚拟DOM
   document.querySelector()等等
   注意：这两种都得在mounted生命周期之后才可以获取！
   而且，可能会遇到还没渲染完全就获取了元素，会导致获取不到样式或者样式的值不准确，加个延时！！！就能解决问题。

// 注意：此处用箭头函数，不会改变this的指向！
setTimeout(()=>{
this.$refs.xxx.xxx
},0)

3. vant中的Grid组件的属性direction
   我在使用该属性时没有显示效果，原因是！！！vant版本问题！！！安装的版本低，而direction是在指定的版本以上的才可以使用，所以有时遇到，明明代码跟官网提供的一模一样却没有效果，可以想想是不是版本问题！
   更新版本：
   先卸载npm uninstall vant 再重新下载:npm i vant -S

4. JS快速将字符串true和false转化成布尔类型
   JSON.parse(‘true’) // 返回 （布尔类型）true
   JSON.parse(‘false’) // 返回 （布尔类型）false

5. 原生js提供的添加类的api
   添加：节点.classList.add(“类名”)；
   删除：节点.classList.remove(“类名”)

6. 父组件给子组件传数字型的数据
   :num=“3"传的是数字型
   num=“3” 和 :num=” ‘3’ "传的是字符串
   :num=“true” 传的是布尔类型