- 博客(125)
- 收藏
- 关注
RSS订阅原创 uniapp开发微信小程序按钮保存图片
/ :show-menu-by-longpress=‘true’ 开启长按保存图片。url: that.qRCode.paymentCode, //图片的url地址。title: ‘保存成功’,
2024-05-21 14:37:51
417
原创 vue3步骤条带边框点击切换高亮
形状可自行更改path 标签里的 :d=“[num!‘M 0 0 L 160 0 L 176 18 L 160 38 L 0 38 L 15.5 18 Z’ : ‘M 0,0 L 160,0 L 176,18 L 160,38 L 0,38 Z’]”如果是div使用clip-path: polygon(0% 0%, 92% 0%, 100% 50%, 92% 100%, 0% 100%, 8% 50%);进行裁剪加边框没实现成功。目前这个使用svg完成带边框的。
2024-04-30 16:54:10
351
原创 在Vue项目使用kindEditor富文本编译器以及上传图片
第一步第二步，建立kindeditor.vue组件第三步引入如果需要自定义行距下拉菜单可以直接修改kindeditor-all.js这个。你好！ 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Markdown编辑器, 可以仔细阅读这篇文章，了解一下Markdown的基本语法知识。我们对Markdown编辑器进行了一些功能拓展与语法支持，除了标准的Markdown编辑器功能，我们增加了如下几点新功能，帮助你用它写博客：撤销：Ctrl/Command + Z重做：Ctr
2024-04-16 17:19:53
1858
原创 VUE3中@vueuse/core包useIntersectionObserver懒加载功能
【代码】VUE3中@vueuse/core包useIntersectionObserver懒加载功能。
2023-05-25 18:23:33
348
原创 返回数组中第一位中的url字段如果有children下一级的话就找到children中的第一级一次类推 并且返回的字符串 第一位如果是 / 就去掉后续的/ 则替换城-
返回数组中第一位中的url字段如果有children下一级的话就找到children中的第一级一次类推。并且返回的字符串 第一位如果是 / 就去掉后续的/ 则替换城-
2023-05-12 17:40:06
111
原创 VUE生成PDF
生成pdf可自动分页生成多页npm install --save html2canvasnpm install jspdf --savepdf.js// 导出页面为PDF格式import html2Canvas from 'html2canvas'import JsPDF from 'jspdf'export default{ install (Vue, options) { Vue.prototype.getPdf = function () { var title
2022-05-27 17:27:51
7614
原创 VUe中 ehcarts随着点击浏览器放大缩小按钮自适应
在public文件夹中创建js文件a.js 文件名字随意var EleResize = { _handleResize: function (e) { var ele = e.target || e.srcElement var trigger = ele.__resizeTrigger__ if (trigger) { var handlers = trigger.__z_resizeListeners if (hand
2022-04-13 11:39:39
502
原创 Vue中this.$set的用法
this.$set( target, key, value）target：表示数据源，即是你要操作的数组或者对象key：要操作的的字段value：更改的数据例如removeId 取的是id,然后对 this.MUbanList.数组进行操作this.MUbanList[b].chenck = 'false’此字段只有前台进行添加操作这样的写法是针对数组集合操作方可数据改变页面进行渲染let removeId = localStorage.getItem('RemoveContentID')
2022-04-13 10:38:41
1490
原创 天地图区域行政区划
我这边的写法是通过每个城市的orgID 如浙江省是330000，getEdgeMapInfo获取下面相对应的城市然后通过接口返回的json数据 去请求json文件夹获取数据drawLine(id) { let style = { color: 'blue', weight: 3, opacity: 1, lineStyle: 'dashed', // 虚线 fillColor: 'tr..
2022-04-11 14:02:51
5515
2
原创 vue-print-nb打印功能
安装依赖：npm install vue-print-nb --save在main.js中写入import Print from 'vue-print-nb'Vue.use(Print);要打印的区域加上id<div id="prinst" style="width:100%;"></div><div v-print="printObj">打印</div>在data中data() { return { dialogVisi
2022-04-08 14:10:19
1826
1
原创 前端调起VLC客户端播放rtsp视频
下载好vlc客户端后使用注册表即可调起Windows Registry Editor Version 5.00[HKEY_CLASSES_ROOT\rtsp]@="rtspProtocol""URL Protocol"="" [HKEY_CLASSES_ROOT\rtsp\DefaultIcon]@="C:\\Program Files\\VideoLAN\\VLC\\vlc.exe,1" [HKEY_CLASSES_ROOT\rtsp\shell]@="" [HKEY_CLA.
2022-02-10 11:26:22
1185
原创 移除HTML标签代码
/移除HTML标签代码/function removeHTMLTag(str) {str = str.replace(/</?[^>]>/g,’’); //去除HTML tagstr = str.replace(/[ | ]\n/g,’\n’); //去除行尾空白//str = str.replace(/\n[\s| | ]*\r/g,’\n’); //去除多余空行str=str.replace(/ /ig,’’);//去掉return str;}...
2021-11-13 09:44:40
338
原创 Elemtent多选择框权限控制多选择框
直接上代码<div><div class="JuesCheack"> <el-collapse accordion> <el-collapse-item v-for="(item,index) in newTreeList" :key="index"> <template slot="title"> <el-checkbox-gr...
2021-10-25 09:26:18
369
1
原创 Echarts地图四级下钻
这里地图数据只做了杭州市的下钻到区的，数据可自行下载地图数据Echarts要下载5.0以下的版本，public下的map文件存放着地图数据<template> <div> <div> <el-button size="mini" type="primary" @click="backMap()" class="btn">返回概览</el-button> <div id="mapcontainer"></.
2021-09-18 17:13:19
1882
原创 点击按钮div展开收起
点击按钮下方收起展开<el-button size="mini" type="warning" circle @click="fun_animate" style="height:28px"> <i v-if="is_show" class="el-icon-caret-bottom"></i> <i v-if="!is_show" class="el-icon-caret-top"></i></el-button>&..
2021-08-04 16:40:42
964
原创 echarts柱状图
<template> <div id="mainCH" style="width: 100%; height: 400px;"></div></template><script> let echarts = require('echarts/lib/echarts') // 引入柱状图组件 require('echarts/lib/chart/bar') // 引入提示框和title组件 require('echarts/lib.
2021-08-04 16:31:07
270
原创 解决vue-seamless-scroll滑动点击事件问题
需要在vue-seamless-scroll外层定义一个div然后写上@click=“handleClick($event)”在vue-seamless-scroll里循环的内容，标签上添加:data-obj=“JSON.stringify(list)”，我这里添加那么多，因为有的找不到，所以一个一个试的<div style="padding: 0 16px 0 18px;box-sizing: border-box;height: 162px;overflow: hidden;" @cli.
2021-08-04 16:14:15
1235
原创 Echarts柱状图
我这里的数据是随便写的，让后台给接口的时候，把排名从高到底给好<template> <div id="main2" style="width: 460px; height: 280px;"></div></template><script> // 引入 echarts 核心模块，核心模块提供了 echarts 使用必须要的接口。 import * as echarts from 'echarts/core'; // 引入柱状图图表.
2021-08-04 11:51:13
820
原创 js对象以每三个为一组
原数组格式为新数组格式为var dddd = [ { "beginDate":"2021-08-07", "endDate":"2021-08-07", "name":"技中高级人才专场招聘会" }, { "beginDate":"2021-08-14", "endDate":"2021-08-14", "name":"“家燕回巢”滨江区本地户籍大学生实习就业专场招聘会" }, {
2021-07-31 16:34:13
538
原创 echarts仪表盘
<!-- echartscom.vue --><template> <div class="charttest"> <div style="width:180px;height:160px;" :id="echarts" class="echarts" ref="echarts"> </div> </div></template><script> let echarts = require.
2021-07-28 10:24:03
1003
原创 echarts柱状图
let myChart = echarts.init(document.getElementById("main")); var option = { tooltip: { trigger: 'axis', axisPointer: { type: 'shadow' }, }, legend: { x:'right', //可设定图例在左、右、居中 y:'top', //可设定图例在上.
2021-07-23 17:40:04
2775
原创 elment表格sort-method自定义排序功能
点击排序箭头来调取接口进行数据排序在el-table表格中写入点击事件@sort-change=“changeTableSort”默认以什么单位进行倒序还是顺序排序，prop对应这字段:default-sort = “{prop: ‘ptuid’, order: 'ascending '}”在表格中要写入 :sortable="‘custom’"<el-table border stripe v-loading="loading" ref="multipleT..
2021-07-13 16:57:15
2720
原创 VUE使用Bus传值
首先建个bus.js文件JS文件内容如下import Vue from 'vue'export default new Vue()然后在我们要传值的页面中引入，对应自己放的位置import BUS from ‘…/utils/bus.js’NavChild为传值的名字BUS.$emit('NavChild',数据内容)在我们接收的页面在继续引入bus.jsimport BUS from ‘…/utils/bus.js’infor就是我们传过来的值Bus.$on('NavChild'
2021-07-13 16:47:22
997
原创 element DatePicker 日期选择器多选模式触发点击时间事件
这里有个功能，当点击时间或者取消选择时间，要触发事件来进行操作。但是当时间组件type为dates时就不能点击触发chang事件，点击确定按钮才会触发。这里在是对这个进行监听来触发事件<el-date-picker v-model="shangkedata" type="dates" clearable placeholder="选择日期" format="yyyy - MM - dd" value-format="yy
2021-06-04 17:50:54
9537
原创 js 数组对象格式往第一位新增一个对象
后端只返回了，管理员1，新增角色，超级管理员三个对象。我们自己要新增一个全部，用来表格筛选一个数组的处理let quan = { id:0, name:'全部',}this.jueSe = res.data.datathis.jueSe.unshift(quan){ "data":[ { "id":1, "name":"管理员1" }, { "id":4, .
2021-06-04 17:34:25
3038
原创 element 循环动态Checkbox 多选框
直接放图，这里做的是权限控制<table width="100%"> <tbody> <tr v-for="(permissionTop,topIndex) in tableData" :key="topIndex"> <th style="line-height:48px;border:1px solid #1E9FFF;padding:0 10px;width: 150px;"> <el-checkbox :
2021-06-04 17:26:29
4833
1
原创 element 表格图片预览模式
安装插件npm install v-viewer --save// 在main.js中全局引用import Viewer from "v-viewer"// 图片预览import "viewerjs/dist/viewer.css"// 图片预览 Vue.use(Viewer) Viewer.setDefaults({ defaultOptions: { zIndex: 9999 }, Options: { "inline": true, .
2021-05-28 15:41:53
614
原创 VUE 解决百度地图循环加载marker并添加多个信息窗口，解决只显示最后一个窗口信息的问题
循环添加的标注点只显示最后一个信息baiduMap() { var bmap = new BMapGL.Map("allmap"); // 创建Map实例 bmap.centerAndZoom(new BMapGL.Point(116.297611, 40.047363), 17); // 初始化地图,设置中心点坐标和地图级别 bmap.enableScrollWheelZoom(true); // 开启鼠标滚轮缩放 var path...
2021-05-27 16:01:54
2850
3
原创 Element Select 选择器加分页
这里是模糊搜索下拉菜单，带上分页功能<el-select v-model="Stateval" filterable remote size="mini" reserve-keyword placeholder="请输入关键词" :remote-method="remoteMethod" :loading="loading" .
2021-05-20 11:05:15
2772
原创 echarts父组件传子组件值动态获取数据改变
点击会调取接口进行更改数据进行赋值然后传给子组件props: { echartStyle: { // 样式 - 1 type: Object, default() { return {} } }, titleText: { //标题文本 - 1 type: String, default: '' }, opinion: { //区域名称 - 1..
2021-05-14 15:02:01
1143
4
原创 element表格过多隐藏功能
这个表格因为字段过多出现的横向滚动条，我这里没有采用官网固定表头或者表尾。选择用这些字段点击控制某些字段表格的显示隐藏这里的列表选择后端给的接口{"state":10001,"msg":"ok","data":{"编号":false,"合同编号":false,"对方单位":false,"合同名称":false,"签订日期":false,"合同金额":false,"支付情况":false,"支付完成时间":false,"对方联系人":false,"对方联系电话":false,"公司经办人":fa..
2021-04-19 16:20:06
522
原创 百度分享功能
<script> window._bd_share_config = { common: { bdText: '自定义分享内容', bdDesc: '自定义分享摘要', ..
2021-04-17 11:17:55
1016
原创 ElementUI 时间组件限制
两个时间组件做个限制，第二个可选择时间必须大于第一个时间给组件写上:picker-options="pickerOptions"属性<el-date-picker type="date" placeholder="选择日期" v-model="form.jzdate" value-format="yyyy-MM-dd" :picker-options="pickerOptions"></el-date-picker> <el-date-pic..
2021-03-22 17:30:35
861
原创 VUE中的富文本编辑器
富文本编辑器wangEditor官方链接<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/wangeditor@latest/dist/wangEditor.min.js"></script>我这里进行的是页面CDN引入的方式页面是VUE的写法<div id="div1"></div>在页面创建一个DIV其中ID名字在data里定义的editor:'', t
2021-03-15 16:17:57
488
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人