vue自己写了一个div菜单,点击按钮展开,点击其他地方关闭这个div菜单
需求是通过点击body页面,在其他地方就关闭这个<div>菜单,给这个div一个id:problemList,但是点击我打开的按钮,不关闭。
created () {
document.onclick = function () {
// 要关闭的div的id (problemList)
document.getElementById('problemList').style.display = 'none'
}
},
点击按钮打开模态框的方法要写个阻止冒泡事件,不然会点不开
getItme() 是点击打开div的事件
// 控制问题列表的显示和关闭
getItme (e, num) {
this.stopEvent(e)
document.getElementById('problemList').style.display = 'block'
},
vue自己写了一个div菜单,点击按钮展开,点击其他地方关闭这个div菜单的更多相关文章
- 用vue.js写的一个瀑布流的组件
用vue.js写的一个瀑布流的组件:https://segmentfault.com/a/1190000010741319 https://www.jianshu.com/p/db3cadc03402
- 使用 vue 仿写的一个购物商城
在学习了 vue 之后,决定做一个小练习,仿写了一个有关购物商城的小项目.下面就对项目做一个简单的介绍. 项目源码: github 项目的目录结构 -assets 与项目有关的静态资源,包括 css, ...
- vue 自己写的一个日历
样式: //quanbu全部代码 <template> <div class="priceListContent clearfix"> <!-- 顶部 ...
- vue elementui 写的一个后台管理页面模板
https://github.com/PanJiaChen/vue-element-admin
- 原生js写的一个弧形菜单插件
弧形菜单是一种半弧式或者全弧形菜单,是一种不同于传统横向或者竖向菜单形式的菜单.最近在网上看到好多人写出了这种效果,于是也尝试自己写了一个. 实现方式:原生态js 主要结构: 1.参数合并 var d ...
- vue element-ui怎样提炼一个自己写的js当作公共js
vue element-ui怎样提炼一个自己写的js当作公共js请教一下各位大神,我刚刚触摸vue element-ui几天,写的一个清晰检索的input框,现在需当作项目公共的部分,可遭需的html ...
- 自己写的一个Vue
下面这里是我自己写的一个小型的vue,原理就是proxy: //Proxy天生没有prototype,因此要加上,不然extends会报错 Proxy.prototype = Proxy.protot ...
- Vue.js写一个SPA登录页面的过程
技术栈 vue.js 主框架 vuex 状态管理 vue-router 路由管理 一般过程 在一般的登录过程中,一种前端方案是: 检查状态:进入页面时或者路由变化时检查是否有登录状态(保存在cooki ...
- 如何写好一个vue组件,老夫的一年经验全在这了【转】 v-bind="$attrs" 和 v-on="$listeners"
如何写好一个vue组件,老夫的一年经验全在这了 一个适用性良好的组件,一种是可配置项很多,另一种就是容易覆写,从而扩展功能 Vue 组件的 API 来自三部分——prop.事件和插槽: prop 允许 ...
随机推荐
- js中三个默认方法call,applay,bind
这三个都是函数自带的方法(Function.prototype),这三个方法都能够改变函数内部 this的指向, call //call方法接收三个参数,第一个是this指向,第二个,三个是传递给函数 ...
- JVM常用参数(内存分配 内存回收日志)
内存监控 -verbose:gc 测试代码 public static void main(String[] args){ List<Classes> classes=new Array ...
- LightOJ - 1189 - Sum of Factorials
先上题目 Sum of Factorials Time Limit:500MS Memory Limit:32768KB 64bit IO Format:%lld & %llu ...
- 0613pt-query-digest分析慢查询日志
转自http://www.jb51.net/article/107698.htm 这篇文章主要介绍了关于MySQL慢查询之pt-query-digest分析慢查询日志的相关资料,文中介绍的非常详细,对 ...
- JAVA实现多线程的两种方法
参考URL: http://www.cnblogs.com/jbelial/archive/2013/03/17/2964472.html 1.继承 java.lang.Thread 类. 2.实现R ...
- TRIZ系列-创新原理-8-重量补偿原理
重量补偿原理的表述例如以下: 1)将某一物体与还有一种提供上升力的物体组合,以补偿其重量:2)通过与环境(利用空气动力,流体动力或其他力等)的相互作用.实现对物体的重量补偿: 重力使得我们能够稳稳的依 ...
- JavaScript中bind、call、apply函数使用方法具体解释
在给我们项目组的其它程序介绍 js 的时候,我准备了非常多的内容,但看起来效果不大,果然光讲还是不行的,必须动手. 前几天有人问我关于代码里 call() 函数的使用方法.我让他去看书,这里推荐用js ...
- 消除ADB错误“more than one device and emulator”的方法
当我连着手机充电的时候,启动模拟器调试,运行ADB指令时,报错. C:\Users\gaojs>adb shell error: more than one device and emulato ...
- Spark MLlib介绍
Spark MLlib介绍 Spark之所以在机器学习方面具有得天独厚的优势,有以下几点原因: (1)机器学习算法一般都有很多个步骤迭代计算的过程,机器学习的计算需要在多次迭代后获得足够小的误差或者足 ...
- [IOI 2008] Island
[题目链接] https://www.lydsy.com/JudgeOnline/problem.php?id=1791 [算法] 不难看出,要求的是这个基环树森林中每棵基环树的直径之和 [代码] # ...