1点击form 表单中的button导致页面刷新问题

原因分析：

在form表单里的button，不给button添加type属性，点击按钮，button的类型会默认为submit，会默认提交表单并刷新页面。

将input或者button的type属性改为button，点击按钮页面就不会自动重新加载了。

2nextTick

Vue 实现响应式并不是数据发生变化之后 DOM 立即变化，而是按一定的策略进行 DOM 的更新。nextTick 是在下次 DOM 更新循环结束之后执行延迟回调，在修改数据之后使用 $nextTick，则可以在回调中获取更新后的 DOM

3/deep/ 深度选择器。

vue组件中，在style设置为scoped的时候，里面在写样式对子组件是不生效的，如果想让某些样式对所以子组件都生效，可以使用 /deep/ 深度选择器。

4vue中的.native修饰符

给vue组件绑定事件时候，必须加上native，否则会认为监听的是来自Item组件自定义的事件。

例子：如果使用router-link标签，加上@click事件，绑定的事件会无效因为：router-link的作用是单纯的路由跳转，会阻止click事件，你可以试试只用click不用native,事件是不会触发的。此时加上.native，才会触发事件。

等同于在子组件中：子组件内部处理click事件然后向外发送click事件：$emit("click".fn)

5短路运算

逻辑运算符 &&（短路与）
只要碰到了false或者等价于false的就短路，只要短路了就不会继续往后执行了。如果短路了，得到造成短路的这个值，如果不短路，得到的是第二个值

console.log( true && true ); // true
console.log( 123 && '中国'); // 中国
console.log( false && true ); // false
console.log( true && false); // false
console.log(1 && 0); // 0
console.log( undefined && 0); // undefined 
console.log(null && 1); // null

逻辑运算符 || （短路或）
只要碰到了true或者等价于true的就短路，只要短路了就不会继续往后执行了。如果短路了，得到造成短路的这个值，如果不短路，得到的是第二个值

console.log( true || true ); // true
console.log( 123 || '中国'); // 123
console.log( false || true ); // true
console.log( true || false); // true
console.log(1 || 0); // 1
console.log( undefined || 0); // 0 
console.log(null || 1); // 1

6eval()

eval() 函数可计算某个字符串，并执行其中的的 JavaScript 代码。

eval("x=10;y=20;document.write(x*y)")//输出200

js字符串有length属性

'1234'.length//输出为4

7按钮点击一秒延迟

Vue.directive('preventReClick', { inserted(el, binding) { el.addEventListener('click', () => { if (!el.disabled) { el.disabled = true setTimeout(() => { el.disabled = false }, 1000) } }) } })

工作中遇到的bug