需求是通过点击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菜单的更多相关文章

  1. 用vue.js写的一个瀑布流的组件

    用vue.js写的一个瀑布流的组件:https://segmentfault.com/a/1190000010741319 https://www.jianshu.com/p/db3cadc03402

  2. 使用 vue 仿写的一个购物商城

    在学习了 vue 之后,决定做一个小练习,仿写了一个有关购物商城的小项目.下面就对项目做一个简单的介绍. 项目源码: github 项目的目录结构 -assets 与项目有关的静态资源,包括 css, ...

  3. vue 自己写的一个日历

    样式: //quanbu全部代码 <template> <div class="priceListContent clearfix"> <!-- 顶部 ...

  4. vue elementui 写的一个后台管理页面模板

    https://github.com/PanJiaChen/vue-element-admin

  5. 原生js写的一个弧形菜单插件

    弧形菜单是一种半弧式或者全弧形菜单,是一种不同于传统横向或者竖向菜单形式的菜单.最近在网上看到好多人写出了这种效果,于是也尝试自己写了一个. 实现方式:原生态js 主要结构: 1.参数合并 var d ...

  6. vue element-ui怎样提炼一个自己写的js当作公共js

    vue element-ui怎样提炼一个自己写的js当作公共js请教一下各位大神,我刚刚触摸vue element-ui几天,写的一个清晰检索的input框,现在需当作项目公共的部分,可遭需的html ...

  7. 自己写的一个Vue

    下面这里是我自己写的一个小型的vue,原理就是proxy: //Proxy天生没有prototype,因此要加上,不然extends会报错 Proxy.prototype = Proxy.protot ...

  8. Vue.js写一个SPA登录页面的过程

    技术栈 vue.js 主框架 vuex 状态管理 vue-router 路由管理 一般过程 在一般的登录过程中,一种前端方案是: 检查状态:进入页面时或者路由变化时检查是否有登录状态(保存在cooki ...

  9. 如何写好一个vue组件,老夫的一年经验全在这了【转】 v-bind="$attrs" 和 v-on="$listeners"

    如何写好一个vue组件,老夫的一年经验全在这了 一个适用性良好的组件,一种是可配置项很多,另一种就是容易覆写,从而扩展功能 Vue 组件的 API 来自三部分——prop.事件和插槽: prop 允许 ...

随机推荐

  1. 阿里云oss用做文件存储工具类

    package com.fsk.fsksystem.util; import java.io.IOException; import java.io.InputStream; import java. ...

  2. C#版winform实现UrlEncode

    在Asp.net中可以使用Server.HTMLEncode和Server.URLEncode 将文本或URL的特殊字符编码,但在控制台或Winform程序中没有办法使用到这些方法, 解决办法:右击项 ...

  3. POJ 3130

    这题,加了精度错了,不加精度反而对了... #include <iostream> #include <cstdio> #include <cstring> #in ...

  4. Data Binding Guide——google官方文档翻译(下)

    这篇博客是Data Binding Guide官网文档翻译的下篇.假设没看过前半部分翻译的能够先看Data Binding Guide--google官方文档翻译(上)  一,数据对象 不论什么不含业 ...

  5. 新手git: ssh: connect to host localhost port 22: Connection refused

    由于gitlab上要git pull或者git clone,可是每次都出现这个问题.之前偶尔出现这个问题.可是仅仅是偶尔.这是为什么呢?然后就開始搜索网上的解决方式了. 这个问题搜索网上非常多答案.可 ...

  6. hdu 5411 CRB and Puzzle 矩阵高速幂

    链接 题解链接:http://www.cygmasot.com/index.php/2015/08/20/hdu_5411/ 给定n个点 常数m 以下n行第i行第一个数字表示i点的出边数.后面给出这些 ...

  7. 利用LruCache载入网络图片实现图片瀑布流效果(改进版)

    PS: 2015年1月20日21:37:27 关于LoadImageAsyncTask和checkAllImageViewVisibility可能有点小bug 改动后的代码请參见升级版本号的代码 ht ...

  8. 在Android系统中修改Android.mk使其同时编译rgb2565和rgb2888(向out/host/linux-x86/bin/下新增加一个工具命令)【转】

    本文转载自:http://blog.csdn.net/mu0206mu/article/details/7514559 在Android系统中修改android.mk使其同时编译rgb2565和rgb ...

  9. 软件-集成开发环境:IDE

    ylbtech-软件-集成开发环境:IDE 集成开发环境(IDE,Integrated Development Environment )是用于提供程序开发环境的应用程序,一般包括代码编辑器.编译器. ...

  10. Python使用装饰器自动调用父类__init__

    众所周知,Python中class的构造函数实际是__new__(),但是如果我们执行p1=Point()的时候,不仅会调用Point的__new__方法,而且会调用Point的__init__方法. ...