需求是通过点击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. 在Win32 Application 环境下实现MFC窗口的创建

    // Win32下MFC.cpp : Defines the entry point for the application.// #include "stdafx.h" clas ...

  2. SIM卡中UCS2编码的三种格式(80,81,82)分析

    网上看到一篇比较好的说ucs2编码的文章,保存一下,原文地址: http://hi.baidu.com/youren4548/blog/item/fa08bd1bf61005058618bf1d.ht ...

  3. 手把手实现Java权限(1)-Shiro介绍

    功能介绍 Authentication :身份认证/登录.验证用户是不是拥有对应的身份:  Authorization :授权,即权限验证.验证某个已认证的用户是否拥有某个权限:即推断用  户能否做事 ...

  4. hdu 1011 树型dp

    #include <cstdio> #include <iostream> #include <cstring> #include <vector> u ...

  5. 哈理工 oj 2122 旅行(map + 最短路dij算法)

    旅行 Time Limit: 1000 MS Memory Limit: 32768 K Total Submit: 18(6 users) Total Accepted: 3(3 users) Ra ...

  6. Tomcat扩展——监控

    (转过来,源地址:http://www.jmatrix.org/notes/1067.html) 近期心血来潮.想能否够通过添加一个tomcat的扩展,来持续收集tomcatserver本身的性能信息 ...

  7. Ubuntu使用ssh方法连接不上

    查看远程机器是否安装ssh服务(ubuntu 没有默认安装ssh) 命令:ssh host  (图中没有安装) 安装ssh  命令 sudo apt-get install openssh-serve ...

  8. day63-webservice 04.JaxWsServerFactoryBean和SOAP1.2

    <wsdl:definitions xmlns:ns1="http://schemas.xmlsoap.org/soap/http" xmlns:soap12="h ...

  9. 南海区行政审批管理系统接口规范v0.3(规划) 3.业务办理API 3.1.businessAuditById【业务办理】

    {"c_accept":"Q2015112400002","c_operators":"gz99","v_op ...

  10. 淘宝CDN系统架构

         存储与架构分论坛上,淘宝网技术委员会主席,淘宝网核心工程师章文嵩向我们详细介绍了淘宝网图片处理与存储系统的架构.章文嵩博士的演 讲日程包括了 淘宝的整个系统架构.淘宝图片存储系统架构,淘宝网 ...