Vue js 实现点击页面空白处隐藏指定div
<template><!--向页面添加关闭div的事件监听--><div class="page" @click="hide"><!--添加.stop防止page的点击事件触发，导致无法显示div--><button @click.stop="show">点击显示div</button><!--指定的div。添加.stop防止点击div内的元素时，整个div被关闭--><div @click.stop>...</div></div><template><script>export default {methods:{show(){},hide(){}}}</script>
总结：
通过vue.js 事件的.stop修饰符可以阻止事件继续冒泡传播，也可以使用原生js事件的event.stopPropagation()方法。通过向指定的div添加.stop，可以实现只有点击非该div内的元素时，才会往上冒泡至page，从而实现点击其他地方隐藏div。要向触发显示div的按钮添加.stop，否则一点击按钮，触发show()之后传播到page，立马就会触发hide()，div就无法显示。
如有错误，请指出，谢谢。
