weixin_44867717的博客

事件总线

事件总线

事件总线

事件总线

radio的使用

增加一行和删除一行

vue项目-element UI-NavMenu 导航菜单始终只展开一个全局搜索:unique-opened找到该配置将其改成trueunique-opened：是否只保持一个子菜单的展开<template> <div class="container"> <el-menu default-active="2" class="el-menu-vertical-demo" :unique-opened="true"

Vue项目中本地引用Iconfont(阿里巴巴图标库)-svg图标样式使用 & element UI和ant design皆可下载图标先进入iconfont.cn页面iconfont官网：https://www.iconfont.cn/方法见上使用一准备工作1、先注册，再登录、找到图标管理、我的项目2、点紫色的这个创建自己的项目新建项目界面如下3、图中画蓝线的地方很重要1）、FontClass/Symbol前缀这个很重要，一定不要写成：el-icon-***这样的形式

项目中引入阿里巴巴图标——iconfont图标的使用一、下载图标1、先进入iconfont.cn页面iconfont官网：https://www.iconfont.cn/2、登陆，并选择你要用的图标加入购物车3、点击购物车，并点击下面的添加至项目，自己取一个项目的名字4、在我的项目里下载至本地5、出现一个含有这几项内容的文件夹，其中demo是说明文件，而iconfont是我们需要的文件，iconfont.woff 和 iconfont.woff2 一样，但我们最好用iconfont.w

css实现小圆点<span class="spk-a"></span> .spk-a { display: inline-block; width: 4px; height: 4px; // border: 1px solid #aaaaaa; border-radius: 2px; background-color: #aaaaaa; opacity: 0.5; //透明度 m

vue 中a标签里href带参数，实现当前页面带锚点 <!-- 面包屑区 --> <div class="bread"> <div class="left-pannel"> <!-- 锚点 --> <div class="ab" v-for="(item,index) in detailList.anchors" :key="index"> <a :

elment-ui 导航菜单样式的修改（三）——三级菜单系列-三行三级菜单系列-三行页面及接口数据写法 <div class="top-b"></div> <div class="left"> <el-menu :default-openeds="dactive" class="el-menu-vertical-demo" :unique-opened="true" @open

elment-ui 导航菜单样式的修改（二）——二级菜单系列-两行二级菜单系列-两行页面及接口数据写法 <div class="top-b"></div> <div class="left"> <el-menu :default-active="cur_menu" :default-openeds="cur_menu_arr" class="el-menu-vertical-demo"

elment-ui 导航菜单样式的修改（一）——一级菜单系列-单行一级菜单系列-单行页面及接口数据写法 <div class="top-b"></div> <div class="left"> <!-- :default-openeds="dactive" --> <el-menu class="el-menu-vertical-demo" :unique-opened="tr

浮动变蓝效果代码<div class="f"> <div class="f-a"> <span class="spa">联系合规伙伴</span> <span class="spb">CONTACT</span> <div class="spc" @click="changeContact"> <span class

导航跳转的方法1、回到首页 <!-- logo --> <img class="logo" @click="gotohome" src="../../assets/images/logo.png" alt />方法 gotohome() { //点击跳转至首页页面 // this.$router.go(-1) //指定跳转地址 this.activeIndex = '0' this.$route

css样式中@的使用 - 动态绑定class引入图片常用写法<div class="img-a"></div>css <style scoped lang="less">.container { background-color: #fffaf6; .img-a { width: 375px; height: 224px; position: absolute; backgrou

展开和收起效果图例展开收起结构 <div class="a"> <a-row> <a-col :span="2" :push="22"> <div> <a-row> <a-col :span="8"></a-col>

用户名和下拉列表的使用-引入标记图例结构<el-dropdown class="my-dropdown" trigger="click"> <span class="el-dropdown-link"> <!-- 头像 用户名称 --> <!-- <img class="avatar" src="../../assets/images/avatar.jpg" alt /> --> &l

文件下载模块图例结构<div class="left-b"><div class="wz">相关文件</div><div> <dl> <dt> <template v-if="detaList.related_file == '-' || !detaList.related_file"> <div class="file-im

输入框快速检索图例结构<div> <div class="b"></div> <div class="c"> <span class="spa-a">其他选项：</span> <span class="spa-b">标题：</span> <a-input @change="hand

页面实现扫描二维码的功能实现——qrcodejs2插件的使用图例结构<el-main><div :class="{sta:pink}"> //默认不显示 <div class="stair"> <el-popover placement="left" width="240" trigger="click" :visible-arrow="false"> <div slot="reference

面包屑的功能实现 & 下载按钮的功能实现 & vue-pdf的使用及IE中的适配图例1、面包屑<el-container class="home-container"><!-- 面包屑区 --> <div class="bread"> <el-breadcrumb separator-class="el-icon-arrow-right"> <el-breadcrumb-

路由跳转传参或携带id和name值 & 实现title的hover变蓝效果一、路由跳转传参或携带id和name值1、第一种写法结构<div class="p-aq" @click="openCommon(item_q.item)"> <span>{{item_q.item.question}}</span></div>created() { // 获取问题详情数据 this.getDeta()},方法

截取时分秒——子组件接收父组件传递的数据图例子组件结构<div class="a"> <div class="a-a"> <div class="a-tit">相关资料</div> <div class="a-count"> <el-row> <el-col :span="9"> &

返回顶部和页面吸底1、返回顶部图例结构<div :style=" {opacity:num}" class="stair-bottom" @mouseenter="enterD()" @mouseleave="leaveD()" > <div class="top-a" @click="returnTop"> <span class="stb-set"> <

多选框获取数据和输入框提交信息-pdf在IE中被遮盖图例结构 <el-dialog title="提示" :visible.sync="dialogVisible" width="640px" height="472px" :center="true" :lock-scroll="false" > <template v-slot:title> <div clas

点赞变蓝-数字加1效果图例<div class="b-j"> <div class="b-ja" @click="watch()"> <div style="margin-left:14px"> <div v-if="!detaList.active"> <img src="../../assets/images/dz_h.png" alt />

vue-pdf的应用和IE的适配图例结构简略版<!-- 左侧内容区 --><div class="left"> <!-- <el-button size="medium" icon="el-icon-download" plain>下载</el-button> --> <div class="lef-a"> <div class="count"> <e

selected组件-列表快速检索图例结构 <div class="count-a"> <div class="a"> <div class="a-tag"> <span :style="{ marginRight: 8 }">所属年份:</span> <template v-for="(item,index) in inter_yea

移动端-顶部返回键的点击方法图例html <van-nav-bar title="题目" left-arrow @click-left="onClickLeft()" />methodsmethods:{ onClickLeft() { console.log(window.history.length); //点击时，返回值为2 if (window.history.length <= 1) { //此时为首页状态 t

表格-多层级表头-带分页-带文字提示-带弹框图例格式1、按钮-带弹框 <div> <div class="a">结果汇总列表</div> <div class="a-a"> <div> <el-button style="margin-bottom:10px">确认评价结果</el-button> </div>

表格铺满-slot用法图例格式//添加列表按钮<div style="display:inline;float: right;margin-top:15px"> <el-button type="primary" @click="addLine">添加培训自查</el-button></div>//表格// max-height="10000000000" 用于无分页<el-table :data="tableData"

表格中插入tooltip-带分页图例格式 <div class="a">评价列表</div> <div> <el-table :data="tableData.slice((currentPage-1)*pagesize,currentPage*pagesize)" style="width: 100%" > <el-table-column prop="name"

解决 elementUI 在IE下 table 表格宽度不是100%的问题（注：谷歌浏览器不存在未铺满问题）不加任何前缀的在对应的目录下面添加如下代码：.el-table__header{ width: 100% !important; table-layout: fixed;}.el-table__body{ width: 100% !important;}ie中未铺满状态铺满状态...

请输入效果-铺满100%图例格式<div style="vertical-align: middle;margin-bottom: 50px;"> <div style="width:10%;display:inline-block;position:relative;vertical-align: middle;"> <el-input v-model="formF.name" placeholder="请输入" style="width:80