- 博客(63)
- 收藏
- 关注
RSS订阅原创 popover两个并列放，其中一个点击没反应
<popover ref="isWeiboType" v-model="isWeiboType" width="78" popper-class="select-wary"> <div class="select-item"> <p v-for="(item,i) of weiboSearchItme.type" :key="item.value" :class="i == weiboType ?'hover':''" @click.stop="s
2022-04-14 10:11:42
424
1
转载 header监测路由变化
原文链接在项目中通过命名视图在很多个页面行都设置了头部组件，在项目中就遇到了这么一个问题，这个头部只会加载一次，事实上虽然头部会公用，但是不是所有的头部都一样的，有些页面的头部需要做一些多余的功能，该怎么搞在mounted中定义方法是没用的，因为头部只会加载一次，这时我们就可以通过监控路由，路由变化了，就会执行函数，就可以实现不同页面显示不同的头部了。 watch: { '$route': 'judgeHelp' }, methods: { // 判断help页面显示与否
2021-12-17 17:04:10
220
原创 获取企业微信授权code
由于企业微信vue hash模式下网页授权返回的路径：http://xxx/?code=otRG0-v6GX6L87pCkJOZW_XwAH2e9xcuclVlL5-eobk&state=#/question，拼接code在#之前需要用正则方法（getUrlKey('code')）拿到对应codecreated() { // 由于企业微信vue hash模式下网页授权返回的路径：http://xxx/?code=otRG0-v6GX6L87pCkJOZW_XwAH2e9xcuclVlL5-eo
2021-12-02 15:52:27
2129
转载 Vue 移动端禁止页面放大缩小
原文链接：https://blog.csdn.net/fufu_dclt/article/details/105137041安卓：在 index.html 中添加 meta 标签。<meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, viewport-fit=cover, use
2021-11-01 15:07:58
607
转载 VUE 通过id 滚动到指定位置
原文链接：https://www.jianshu.com/p/22f0f589e6c6scrollTopAnimate(id){ this.$nextTick(()=>{ window.scrollTo({top:document.getElementById(id).offsetTop - 138, behavior: 'smooth'}) // 假如是指定的div内的内容滚动到指定位置 document.querySelector('#se
2021-11-01 15:03:27
1476
转载 elementui datetimerange时间只能选择整点
原文链接：https://blog.csdn.net/qq_42335214/article/details/112705193?utm_medium=distribute.pc_aggpage_search_result.none-task-blog-2aggregatepagefirst_rank_ecpm_v1~rank_aggregation-17-112705193.pc_agg_rank_aggregation&utm_term=elementui%E6%97%A5%E6%9C%9F%E
2021-09-26 16:42:38
2294
原创 别人集成好的tinymce
组件网址：https://packy-tang.gitee.io/vue-tinymce/#/Example1.安装npm install @packy-tang/vue-tinymce2.将node-module中的tinymce文件整个拷贝到public文件下3.先去这里下载zh_CN语言包，解压然后放置到‘public/tinymce/langs/zh_CN.js’文件下或者浏览器直接输入https://www.tiny.cloud/tinymce-services-azure/1/i18n
2021-09-06 17:11:13
106
原创 vue拖拽改变div高度
注意：当div在dialog中时可能会出现，第一次弹出dialog拖拽管用，第二次弹出dialog拖拽没用，此时可以给dialog加一个v-if，强制重新渲染一下。具体为啥，我也说不出所以然<div id="scrollbarBox"> <Scrollbar wrap-style="overflow-x: hidden;" extend="true" view-class="el-autocomplete-suggestion__list" wrap-
2021-09-06 13:44:31
1061
转载 2021-06-03
nvm下载与安装**作用：**进行nodejs版本控制下载地址：https://github.com/coreybutler/nvm-windows/releases/tag/1.1.7安装：1.选择下图二中的下载，解压后点击安装，一直下一步2.成功后打开cmd，输入nvm回车查看是否安装成功3.打开settings.txt配置下载源，如图三4.nvm使用：下载特定版本的node 比如8.0.0 nvm install v8.0.0 再下一个 nvm install v9.0.0
2021-06-03 16:35:33
53
原创 弹出框中下拉框在页面滚动时显示在页面上
处理方法1从网上找的解决办法原文链接：(https://www.jb51.net/article/162258.htm)[https://www.jb51.net/article/162258.htm]创建js文件：// src/mixins/fackClickOutSide.jslet lock = true;let el = null;const MousedownEvent = new Event('mousedown', {bubbles:true});const MouseupEve
2021-05-12 16:46:12
420
转载 elementui Cascader 和 Select 当页面滚动时，下拉框不一起跟着滚动的问题
原文链接：https://www.cnblogs.com/suiyide/p/14511683.html当出现多个滚动条，滚动元素父级滚动条会随着动，但是滚动父级的父级滚动条不会随着动Select加上:popper-append-to-body=“false”Cascader加上:append-to-body=“false”...
2021-04-21 16:35:45
1645
原创 tree树自定义内容展示
方法一：<el-tree class="filter-tree" show-checkbox :data="data" :props="defaultProps" default-expand-all node-key="id" :default-checked-keys="checkedKeys" :filter-node-method="filterNode" ref="tree" @check-change="nodeChange"
2021-04-13 16:59:50
302
转载 vue下载后端返回的压缩包
原文链接：https://blog.csdn.net/qq_42345108/article/details/102842492resumeDownload(data) { return request({ url: app.resumeDownload, method: 'post', data, responseType: 'blob' // 请求头必须加 }) },// 下载简历压缩包 downZip(id) {
2021-04-12 16:50:55
867
原创 生成二维码
1.下载插件npm install qrcodejs2 --save2.引入import QRCode from "qrcodejs2";3.使用<div id="qrCode" ref="qrCodeDiv"></div>// 为了防止重复生成二维码，使用置空进行控制document.getElementById("qrCode").innerHTML = "";// "qrCode"为上面二维码容器的id名，也可以写为‘this.$refs.qrCodeDi
2021-03-15 14:15:55
64
原创 复制粘贴插件与使用
下载插件npm install clipboard --save引入import Clipboard from "clipboard";使用,data-clipboard-text中是动态绑定的链接<el-button type="text" @click="copyInputCase" class="copy-inputCase" :data-clipboard-text="imgLink"> 复制链接</el-button>// 复制c
2021-03-15 13:54:40
733
原创 筛选两个动态数组中增加减少的值
// 手动改变tree树默认选中值let keys = ['customerName']dataChecked.forEach((item, index) => { keys.push(item.attribute)});this.checkedKeys = keys// 保持原有排序状态下增减if (this.dataChecked.length === 0) { this.dataChecked = JSON.parse(JSON.stringify(dataChecked)
2021-03-11 16:51:14
116
原创 验证码设置60s发送一次
<el-button plain :disabled="!dydShow" @click="codeClick"> 获取验证码 <span v-if="!dydShow">({{ codeTimer }}s)</span></el-button>if (!this.timer) { // 倒计时间 this.codeTimer = 60; // 判断时间是不是要显示 this.dydShow = false; // 设置倒计时定时器
2021-03-10 11:46:58
519
原创 elementui树实现拖拽，且只能同级之间上下拖拽，不允许拖拽到里面
<el-tree class="filter-tree" :data="dataChecked" :empty-text="emptyText" :props="defaultProps" default-expand-all draggable :allow-drop="collapse" :filter-node-method="filterNode"></el-tree>data和methods中数据dataChecked: [],d
2021-03-10 10:36:12
4913
2
转载 elementUI from表单密码是否相等校验
原文链接：https://blog.csdn.net/xfWgaoqiang/article/details/108845967<el-form-item v-else label="密码" label-width='150px' prop="password"> <el-input :placeholder="info.password" v-model="info.password" style="width: 500px"></el-input></
2021-03-09 18:14:52
1941
原创 vue可拖拽列表
1.先下载插件npm i -S vuedraggable中文文档：http://www.itxst.com/vue-draggable/tutorial.html2.引入import draggable from "vuedraggable";components: { draggable },2.vue中使用<draggable :list="dataChecked" :disabled="!enabled" class="list-group" ghost-cla
2021-03-09 10:57:20
381
转载 elementUI 表格固定某些列后，下边框和侧边框不显示（被遮盖）
转载自：https://my.oschina.net/u/3680343/blog/3144548https://www.cnblogs.com/shuen/p/10196545.html给table设置样式，解决底部边框被遮盖.el-table__fixed { height: 100% !important; //设置高优先，以覆盖内联样式}.el-table__fixed-right { height: 100% !important; //设置高优先，以覆盖内联样式}添加css
2021-02-26 17:12:51
3632
1
转载 解决elementui表格操作列自适应列宽
转载自：https://www.jb51.net/article/203011.htm给操作列绑定宽度属性:width="actionColWidth < 80 ? 80 : actionColWidth"把操作列的所有按钮用一个div套起来<div class="action-col"> <el-button></el-button> ...</div>data里设置列宽初始值actionColWidth: 80, //表格操作列
2021-02-23 17:55:14
1150
1
原创 elementUI结束日期不能大于开始日期
结束日期不能大于开始日期<el-date-picker v-model="addForm.startDate" type="date" size="mini" format="yyyy-MM-dd" value-format="yyyy-MM-dd"...
2021-01-27 15:55:46
590
原创 动态替换邮件中指定符号的值
例如：str="{Candidate_Name}，您好，{Company_name}邀请您参加{Job_Title}面试，面试日期：{Date}，面试时间：{Time}，面试地点：{Position}"/g表示全局替换 // 替换邮件模板值 replaceTemplate(str) { return (str = str .replace(/{Candidate_Name}/g, '小明') .replace(/{Company_name}/g, 'x
2021-01-27 15:50:06
147
原创 elementui修改滑块样式
效果图：css样式该样式写的时候不要加scoped，否则会没有用// 禁用时的样式.el-slider__runway.disabled .el-slider__bar{ background-color: #e0eaf3; } .el-slider__button { width: 10px; height: 15px; background: #7589d4; border: none; border-radius: 0; } .el
2021-01-14 18:14:50
2474
转载 vue页面按钮加权限
原文链接： https://blog.csdn.net/acoolper/article/details/97375142获取按钮方法，以及判断是否有权限方法jsimport store from '../../store'import Vue from "vue";export default { namespaced: true, state: { btnlist: [], // 按钮权限列表 }, getters: { btnlist: (state) =&g
2021-01-08 16:07:22
444
原创 elementUI 步骤条改为虚线，且点击切换
效果图：<el-steps :active="activeIndex" align-center finish-status="wait"> <el-step v-for="(item, index) in bzt_value" :key="item.id" :title="item.name" icon="iconfont iconyuandian" @click.native="dianji_bzt(index, item.process_
2021-01-06 18:18:34
3200
2
原创 发送邮件内容追加按钮以及传值
其中：webUrl是在env.development.js中定义的公共路径在页面获取传值通过：this.$route.query.company 获取，以此类推this.interviewList.description + ` <div> <a type="button" style=" display: inline-block; backgr
2021-01-06 16:23:48
551
原创 Switch 开关，将字写在滑块上面
效果图：<el-switch v-model="ruleForm.status" class="tableScopeSwitch" :active-value="0" :inactive-value="1" active-text="开" inactive-text="关" active-color="#3072ae" ></el-switch> ><style lang="scss">.table
2021-01-06 13:43:49
824
转载 去除HTML的标签样式
val值为下面的参数<div style="color: green; font-size: 40px"> <p>我是p标签</p></div>js通过正则表达式过滤val.replace(/<\/?.+?>/g, '')
2020-11-30 11:16:59
155
原创 elementUI from表单必填项已有值但是提示信息还在
<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm"> <el-form-item label="活动名称" prop="name"> <el-input v-model="ruleForm.name"></el-input> </el-form-item> <el-form-it
2020-11-18 15:02:24
5786
5
转载 后台返回数据中有‘\n’换行符，但是在文本中不显示换行效果
转载链接：https://blog.csdn.net/weixin_39897287/article/details/101757746返回的后台数据是含有换行符的，但是界面显示不换行。后面发现用v-html就可以解决<div class="text" v-html="trainDetail.trainingContent"></div>然后js代码里面还要处理一下let aa= this.xxx.name.replace(/\n/g,"<br>");thi
2020-11-18 14:51:49
2197
转载 本地运行打包后的vue项目
转载自：https://blog.csdn.net/qq_33718889/article/details/88725525?utm_medium=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-1.add_param_isCf&depth_1-utm_source=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-1.
2020-11-10 13:08:27
2000
原创 dagre-d3简单实现流程图
<template> <div> <svg width="1000" height="1000"> <g /> <rect /> </svg> </div></template><script> import dagreD3 from "dagre-d3" import * as d3 from "d3" export default
2020-11-09 16:56:30
1170
转载 vue导出
转载自：https://blog.csdn.net/qq_42221334/article/details/995669151.安装插件cnpm install vue-json-excel2.min.js中引入使用import JsonExcel from 'vue-json-excel'Vue.component('downloadExcel', JsonExcel)3.直接在页面中使用<download-excel class = "export-excel-wra
2020-11-09 10:39:06
132
原创 mixins中添加表格动态高度方法
mixins文件export default function(height) { return { data() { return { tableHeight: 500 } }, created() { this.getClientHeight() }, mounted() { window.onresize = () => { this.getClientHeight() } }, methods: { getCl
2020-10-29 14:09:54
171
原创 echarts图表自适应
**背景：**vue项目中用到echarts图表，页面上有侧边栏，侧边栏收缩图表不能自适应，想通过监听内容部分的宽度让图表resize，试过window带的resize，只能监听浏览器窗口大小变化，为了监听某元素区域的变化而使echarts的尺寸重置本次解决采用 element-resize-detector 可以完美的解决**思路：**因为收缩侧边栏的时候右侧的区域会自动适应，但是echarts不会随之改变element提供的 element-resize-detector 可以轻松解决问题的存在
2020-10-28 16:12:14
632
转载 Windows解决npm命令没有反应
原文链接：https://www.cnblogs.com/zhenchoafeng/p/10863729.htmlnode.js Windows解决npm命令没有反应今天项目关闭再启动后一直停在npm run dev处没有反应，在cmd中输入npm -v没反应解决办法如下：是npm config set prefix 改包的路径出问题了解决办法就是删除c:/user/administrator下的 .npmrc 文件即可。然后输入npm -v 完美解决...
2020-10-20 10:14:39
5775
5
转载 js动态往对象里边添加一项
原文链接：https://blog.csdn.net/quhongqiang/article/details/98218989// 第一种方法let obj ={"name":"tom","age":16}let key = "id";let value = 2obj[key] = value;console.log(obj) // 第二种方法，利用扩展运算符,简单又实用var obj1={"vue":300,"jquery":200};var obj2={"react":500};v
2020-10-19 15:39:46
405
转载 vue输入框改变后没反应，等下一个输入框值改变才会改变
原文链接:https://www.cnblogs.com/huanhuan55/p/12302333.html<el-input v-model="student.name"></el-input>export default { data () { return { student:{} } }, methods: { update () { this.student.name='莉莉丝' }
2020-10-19 15:34:28
1483
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人