- 博客(54)
- 资源 (1)
- 收藏
- 关注
原创 浏览器采坑
(1)scroll没有事件冒泡!Vue.prototype.$isServer && on(document, 'mouseup', e => { console.log('1')});!Vue.prototype.$isServer && on(document, 'scroll', e => { console.log('2')});点击事件,在document上监听,但可以获取任意元素滚动事件,在document上监听,只能从
2021-09-09 10:20:13
258
原创 scss相关
(1)非选择器、和选择器.el-input__icon:not(.el-icon-view) &:not(.edc-icon-eye){cursor:not-allowed;}
2021-09-08 16:01:41
194
原创 echarts legend图例分页
效果:方法:echarts的legend里设置type:'scroll',且一定要有data字段,且data与series里的data一一对应代码:this.myChart.setOption({ color: ['#404C7E', '#4C4FC9', '#8D58E1', '#F05B72', '#FBCE38', '#1A8CFF', '#00B377'], legend: { type: 'scro.
2021-06-18 11:55:58
3408
原创 vue 全屏/退出全屏,esc监控退出全屏
template:<el-button class="fullbutton" type="primary" plain @click="fullScreen">{{fullScreenFlag?'退出全屏':'全屏'}}</el-button>js:data () { return { fullScreenFlag: false, // 全屏/退出全屏 } },mounted () { document.addEventL
2021-02-24 12:39:48
2443
1
原创 vue elementui intput文字内容超长时出现tooltip
html部分:<el-tooltip class="item" effect="dark" :content="expressionContent" placement="top-start" :disabled="isShowTooltip" > <el-input @mouseover.native="inputOnMou
2021-01-20 09:22:02
2421
原创 获取html元素中text的长度
const node = event.targetconst range = document.createRange()range.setStart(node, 0)range.setEnd(node, 1)const rangeWidth = range.getBoundingClientRect().width可参考elementui源码中tooltip相关源码(table/src/table-body.js)
2020-06-24 16:01:28
1184
原创 查找对象数组中的元素
结合ES6,JS里面的find()参考:https://blog.youkuaiyun.com/qq_41485414/article/details/81452118
2020-05-27 11:52:40
541
原创 vue错误记录
(1)Cannot read property 'activeIndex' of undefinedError in mounted hook: "TypeError: Cannot read property 'addItem' of undefined"诸如此类。。原因:可能是项目引入的elementui与vue版本不对应,index.html文件中引用的vue.min.js脚本文...
2019-11-22 12:01:05
529
原创 eslint报错解决及关闭
1. eslint报错,通过配置文件.eslintrc.js设置不提醒https://juejin.im/post/5aa7ba24f265da23771915cf2. eslint错误列举https://www.jianshu.com/p/68d411168a31https://www.jianshu.com/p/2b6b5d0e8ba23. 关闭eslintvue-cl...
2019-11-20 11:18:27
1151
原创 echarts及vue-echarts笔记&问题
(1)图表数据的添加方式一:xAixs.data与series.data都是数组,一一对应。xAixs.data:[1,2,3,4.....]series.data:[1,2,3,4.....]方式二:series.data数组中每个元素是一个数组,分别对应x,y的值series.data:[[1,2], [2,5], [3,6], [4,7].....]方式三:...
2019-08-08 14:40:58
226
原创 移动端组件cube-ui使用
(1)组件引入(vue)<template>。。。<cube-scroll :data="data" ref="scroll" :options="scrollOptions"></cube-scroll>。。。<template><script>import { scroll } from ...
2019-07-31 09:24:57
594
1
原创 js(es6)笔记
(1)遍历1. Object.keys()Object.keys(res).forEach(key => { let temp={ name: res[key].name, lat:res[key].y, lon:res[key].x, }; this...
2019-07-29 11:40:02
130
原创 leaflet使用笔记&报错
一、笔记(1)打开多个popupleaflet默认打开一个popup会关闭另一个,设置autoClose: false即可默认打开多个;同时还可以设置closeOnClick:false(2)显示多个marker直接多次添加marker即可。如果看不到多个可能是各个点之间的距离太大所以地图上没显示出来_(:з」∠)_二、报错(1)Error: Attempted...
2019-07-22 11:41:37
2898
原创 vue组件之间传值,父传子props,子传父$emit
一、父组件向子组件传值,通过props(1)使用方式一:参考:https://blog.youkuaiyun.com/qq_42492055/article/details/82558971(2)使用方式二:使用elementUI的table组件作为子组件,父组件向table传数据:思路:el-table绑定自身数据tableData,在页面初始化时或watch监控props改变时调用...
2019-07-17 17:06:49
289
原创 css动画笔记
(1) Vue中面板宽度变化(展开/折叠)<template>...<div class="menu" :style="showMenuList">...</template><script>export default { data(){ return{ showMenuList: { ...
2019-07-15 19:19:37
103
原创 this相关
(1)VUE中方法中需要在setTimeout()修改绑定的数据这样写是错的:因为此处的this指向的是function需要用箭头函数:
2019-07-01 17:23:01
144
原创 小程序相关
小程序可以使用的图表组件:https://antv.alipay.com/zh-cn/f2/3.x/index.html钉钉小程序,页面之间传递数据https://blog.youkuaiyun.com/ChickenBro_/article/details/86498468注意:(1)修改page里的data,必须使用this.setData函数(2)dd.httpReques...
2019-06-18 21:01:05
147
原创 Vue+elementUI使用笔记
(1) vue引入elementui1.使用npm安装element-uinpm i element-ui -S2.在main.js中导入使用vueimport 'element-ui/lib/theme-chalk/index.css' //别忘了导入样式import ElementUI from 'element-ui'Vue.use(ElementUI)...
2019-06-11 11:29:31
310
原创 ant design修改modal的样式、修改.ant-modal-content属性
问题描述:写了一个组件(index.tsx),引用了ant design的modal组件,在index.less里修改modal组件的.ant-modal-content的css样式无效(给modal组件添加了update-panel对话框外部类名):解决办法:(1)通过modal的API进行设置,可以修改一部分对话框样式(此处只截取部分)使用:(...
2019-06-03 11:10:48
46849
6
原创 arcgis api for js 加载wmts的xml
(1)arcgis api for js使用示例:https://developers.arcgis.com/javascript/latest/guide/quick-start/(2)arcgis使用WMTS使用参考:https://developers.arcgis.com/javascript/latest/api-reference/esri-layers-WMTSLa...
2019-05-28 09:20:37
1434
原创 openlayers加载地图、加载WMTS、包引用
(1)openlayers引入js、css方法:官网的直接引入地址可能无效,可尝试引入以下地址的css、js:<link rel="stylesheet" href="https://openlayers.org/en/v5.3.0/css/ol.css" type="text/css"><script src="https://openlayers.org/en/v...
2019-05-27 18:07:14
1702
原创 React点击/hover修改CSS样式
(1)点击修改样式方法一:(typescript写法)type state = { selected: boolean;};class Measurement extends Component<{}, state> { constructor(props:any) { super(props); this.state =...
2019-05-23 10:58:05
9731
转载 cesium,超图webgl相关资料
一、cesiumcesium环境配置与启动运行https://blog.youkuaiyun.com/UmGsoil/article/details/74280229https://blog.youkuaiyun.com/hzh839900/article/details/78063084点选查询实体,显示信息框https://blog.youkuaiyun.com/hzh839900/article/de...
2019-05-08 09:33:24
1113
转载 layui使用自定义图标
图标库:https://www.iconfont.cn/教程:https://fly.layui.com/jie/9149/
2019-04-30 11:07:18
4795
原创 兼容IE的一些前端插件
1,树状图ztreehttp://www.treejs.cn/v3/api.php2,时间日期插件My97DatePickerhttp://www.my97.net/3,
2019-03-19 17:38:07
690
原创 spring boot+thymeleaf+layui编写后台管理系统
一、界面效果:参考官方文档添加组件即可:https://www.layui.com/demo/admin.html另外参考layuiadmin的demo:https://www.layui.com/admin/二、功能一:点击左侧菜单,右侧tab栏添加对应的标签和内容,并可以嵌入iframe利用lay-filter属性,将左侧菜单组件和tab组件关联。(1)左侧菜...
2019-03-18 11:12:46
15269
原创 spring boot+thymeleaf+bootstrap,前端模板引擎使用
一、thymeleaf引入bootstrap1)pom.xml里添加bootstrap等依赖<dependency> <groupId>org.webjars</groupId> <artifactId>bootstrap</artifactId> <version>4.3.1</ver...
2019-03-11 17:54:41
4536
转载 echarts的label等字体调整大小
https://blog.youkuaiyun.com/xuaner8786/article/details/79241689另外,坐标轴的label字体大小,调整axisLabelyAxis: {axisLabel: { fontSize:'15', fontFamily:'微软雅黑', mar...
2019-03-06 17:58:49
13548
原创 前端表格在线编辑、删除行列
参考:https://github.com/xxtz0522/table_edithttps://www.cnblogs.com/poppy1314/p/6248644.html
2019-02-14 11:27:10
1086
原创 js上传文件,利用input type="file"选择文件及清空选择
<input id="file" type="file">可以实现选择文件;var a=document.getElementById("file");a.files[0];可以读取选择的文件效果:(红框部分,点击叉删除所选文件)具体代码:html:<form enctype="multipart/form-data" method="post
2019-01-11 17:13:52
10535
1
转载 js表格的表头thead固定,tbody内容超出时滚动
参考:http://blog.sina.com.cn/s/blog_603fcfae0102xku3.html
2019-01-11 10:07:54
790
原创 点击div外部,自动隐藏div
效果:点击标签列表外部,自动收起标签列表 方法:采用阻止冒泡 //点击标签列表外部自动收起列表 function stopFunc(e) { e.stopPropagation ? e.stopPropagation() : e.cancelBubble = true; } document.onclick = function(...
2018-12-15 15:46:43
831
原创 动态添加的元素绑定事件注意事项
问题描述:页面加载时通过js、datatable插件等动态添加的元素, 如:"columns": [ {"data": "", "title": "<input type=\"checkbox\" id=\"selectall\" class=\"exportSelect2\">&l
2018-12-15 10:19:18
219
原创 前端小笔记
(1)向后台发送请求的url中参数有中文,可能会出错,解决方法:使用encodeURIComponent()函数转换该参数。例如:var url="${base}/platform/exportbysearch?labelid="+labelid+"&query="+encodeURIComponent(query);(2)有时判断数组中是否有某元素时,要注意“1”和1是不同...
2018-12-11 17:25:24
139
原创 datatable翻页时修改某些内容的样式
情景:第一页勾选了全选按钮,切换到第二页时,默认全选按钮还是勾上的状态, 原因:datatable翻页时会重绘表格,但是表头内容在定义table时已经添加,重绘时只更新表格数据,没有修改表头 解决方法:datatable有个drawCallback参数,可以定义表格重绘时的操作,重绘时修改表头内容即可:$('#example').dataTable...
2018-12-08 19:08:15
1030
原创 img图片在限定尺寸下等比缩放;点击查看原图
一,图片等比缩放效果:html<div class="row" id="imgbox"> <img id="image" src=""></div><div class="row"> <div id="showimg"&
2018-12-06 11:30:36
4119
转载 去除inline-block的label的间隔,及label边框叠加问题
问题一:inline-block的label中间会有间隔,如图:解决方法:https://segmentfault.com/q/1010000007871257 问题二:标签边框会叠加,中间的border为2px,如图:解决方法:https://www.cnblogs.com/luoguixin/p/6476918.html...
2018-12-04 09:50:26
331
原创 textarea多行文本,超出高度时显示滚动条
1,两个div,外面的div高度固定,带滚动条;内部为可编辑的div,高度自适应(或内部采用高度自适应的textarea)<div class="describe"> <div id="describe" contentEditable='true'></div></div>.describe{ height: 100p...
2018-11-30 10:38:15
8466
原创 React中使用jquery、bootstrap
一、React中使用jquery1,在package.json里添加依赖2,安装jquery:npm install jquery --save或npm install3,index.js中将jquery作为模块引入,就可以使用了 二、React中使用bootstrap方法1:1,执行npm install bootstrap --save2,ind...
2018-11-23 19:45:31
5367
1
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人