- 博客(48)
- 收藏
- 关注
RSS订阅原创 Element UI 中的表格 表头合并
实现以上效果el-table中有个属性 header-cell-style 属性：用来设置表头单元格的样式代码如下：<el-table class="state-table" :data="temHoleTableData" size="mini" style="width: 100%" height="100%" :header-cell-style="headerStyle"> <el-table-column prop="project...
2022-04-25 13:42:15
6105
2
原创 自动触发dtree树形菜单组件的点击事件
今天修改公司很久以前项目 用到了很久都不用的dtree树形菜单组件按照需求：从其他页面跳转到该页面，根据携带的参数 自动触发dtree的点击事件，让页面中显示出来相关的内容，查询dtree文档 没有发现直接可以触发点击事件的方法，但是有个一个 openTo(id) 可以打开指定的节点 id: 节点唯一的ID号调用该方法可以将树形结构选中然后可以拿到高亮节点的内容 触发click事件（我此处用的高亮节点的class为nodeSel）dtree.openTo(findMenuId,
2022-03-21 17:57:42
782
原创 svn提交时忽略某些文件的方式
1.在空白处右键选择TortoiseSVN-Settings2.点击Edit3.弹出config配置文件 在里面添加一行global-ignores = *node_modules *idea *git 把想要忽略的文件添加进去，多个名字直接用空格隔开
2022-03-16 13:13:44
2298
原创 ecahrts 散点图根据数据不同在地图上显示不同的颜色
根据需求 要根据接口返回数据的不同 在地图上行显示不同的圆柱以及波浪本来是想在color中使用回调 根据数据返回不同的颜色 但是在color属性中 使用回调函数发现不起作用 而且没有进入回调函数中 查询文档发现在type为lines scatter efferctScatter类型的series中的data属性以type='lines'为例 data属性中有个lineStyle的属性 可以根据单个数据设置样式return data.map(item => { r..
2022-03-06 22:00:58
1367
原创 calc（）函数中的使用Scss变量
$titleHeight: 3.4rem;.record_table { height: calc(100% - #{$titleHeight});}使用 #{变量}的方式
2022-02-27 17:30:50
638
原创 将页面中的canvas导出为图片
const canvasDom = this.$refs[canvas]; //获取canvas DOM对象const imageData = canvasDom.toDataURL('image/png'); //返回base64的URLconst elink = document.createElement('a');const name = { left: '左线喇叭口', middle: '冻结中段', right: '右线喇叭口'}elink.download = name.
2022-02-25 14:56:58
2947
原创 将echarts图表导出图片
将页面中的echarts图标导出pngecharts官网中有个 getDataURL方法 可以返回一个base64的URLlet myChart = this.echarts.init(document.getElementById('large_chart'));const picInfo = myChart.getDataURL({ // 导出的格式，可选 png, jpg, svg // 注意：png, jpg 只有在 canvas 渲染器的时候可使用，svg 只...
2022-02-25 11:17:35
6953
原创 在vue-cli项目中动态修改系统名称
在vue-cli搭建的项目中有个系统配置在页面，在系统配置页面中可以修改改系统的名称，要求修改完系统名后系统中相关显示系统名称的地方都要更改，包括登录页面、左侧导航栏、浏览器中的title在这里将系统名称存在了localstorage和vuex中，存在Vuex中是因为Vuex 的状态存储是响应式的。当 Vue 组件从 store 中读取状态的时候，若 store 中的状态发生变化，那么相应的组件也会相应地得到高效更新。存在localstorage是方式页面刷新后vuex中的内容清空 所以综合起来
2021-12-20 10:49:00
1504
1
原创 v-for 循环生成多个表单元素 给动态生成的表单元素绑定值并且添加校验规则
需求：点击新增按钮 能不断生成下级部门，所以我再data中定义了一个变量subordinateDepartmentNum：0 默认值设置为0给增加按钮添加点击事件 每点击一次按钮subordinateDepartmentNum加1// 新增下级部门addDepartment() { this.subordinateDepartmentNum++;},通过v-for循环生成表单 这样就可以生成多个下级部门的表单元素<div class="ad...
2021-12-02 16:40:59
7057
原创 element ui级联选择器添加必填验证
cascadeValue: [ {required: true,type:'array', message: "不能为空", trigger: "change"}],通过以上方式给级联选择器添加必填验证 即使选择了内容也一直提示不能为空这种验证方式不通过，换一种方式，通过添加 自定义验证规则的方式来添加验证cascadeValue:[ {validator:validCascader, trigger: "change"}],var validCascader..
2021-11-26 10:01:20
3560
2
原创 去除登录时输入框因自动填充产生的白色背景
input { height:50px; background: rgba(94,206,255,0.4); font-size: 16px; border: 1px solid rgba(0,255,255,0.4); outline: none; //去除自动填充的白色背景 &:-webkit-autofill , textarea:-webkit-autofill, select:-webkit-autofill { -webkit-text-fill-c.
2021-11-19 15:32:15
503
原创 threejs 加载模型遇到的问题
今天在处理threejs加载的Obj模型的时候，想让按照模型的不同类型一次加载到页面中，根据模型中的children中的name来判断模型的类型//consle.log(this.modelObject.children.length) //86this.modelObject.traverse(child => { console.log("in") scene.add(child); })以上代码 如果 不加scene.add(child) 控制台上打.
2021-11-18 16:19:03
1409
原创 three.js 学习中遇到的几个知识点整理
1、three.js 中的材质 设置lineWidth属性无效原因是WebGLRenderer渲染器中暂不支持这个属性，只有CanvasRenderer渲染器可以支持这个属性2.相机的lookat代表一个方向，而不是一个点3.相机的属性修改完成之后，需要调用camera.updateProjectionMatrix()方法来更新4.纹理加载类 ImageUtils加载不同图片格式的一个类 THREE.TextureLoader()5.纹理贴图的重复的方式THRE.
2021-10-19 17:01:53
239
原创 数组调用toString和valueOf方法的返回值有何不同？
vararr=['red','green','blue'];console.log(arr.valueOf());//['red','green','blue']console.log(arr.toString());//red,green,blueconsole.log(arr.join(",")); //red,green,blue...
2021-09-30 23:37:17
103
原创 three.js 笔记3
网格对象提供的方法（属性）1、position:该属性决定该对象相对于父对象的位置，通常父对象是THREE.Scene对象或者THREE.Object3D对象2、roation:该属性可以设置每个轴的旋转弧度，Three.js还提供了设置相对特定轴的旋转弧度的方法：rotateX() rotateY() rotateZ()3、scale 该属性可以沿着x y z轴缩放对象4、translateX(amount) 沿x轴将对象平移amount距离5、translateY(amount) 沿
2021-09-29 15:00:51
461
原创 three.js 笔记2
场景是所有物体、光源和摄像机的容器scene中最常用的方法和属性add(object):用于向场景中添加对象，使用该方法还可以创建对象组remove(object):使用该方法可以将对象从场景中移除 object为场景中对象的引用children:用于返回一个场景所有对象的列表，包括摄像机和光源getObjectByName:在创建对象的时 可以指定唯一的标识name 使用该方法可以查找特定名字的对象，当参数recursive设置为false时，在调用者子元素上查找，当参数recursi
2021-09-29 13:57:56
756
原创 three.js 笔记1
最近在学习three.js的内容 想着把学习的内容整理成笔记 方便以后使用在场景中 产生使物体产生阴影的方法1.给渲染器设置 shadowMapEnabled的属性值为true2.明确指定哪个物体投射阴影3.指定哪个物体接收投影4.定义能够产生阴影的光源，将光源的castShadow的属性值设置为truerenderer.shadowMapEnabled=trueplane.receiveShadow=true; //平面对象接收投影cube.castShado...
2021-09-29 13:45:36
110
原创 element ui 切换tab页面 表格下方多了一块空白区域
在弹窗中有显示不同的table表格，tab切换页进行切换，在切换过程中发现table表格底部出现空白（表格的高度是固定的）解决方式给el-table添加类名 myTable.myTable .el-table__body-wrapper { height: 100% !important;}...
2021-06-30 16:51:42
2641
1
原创 maptalks 添加 UIMarker 文档没有移除之前添加的uimarker的方法
var dom = '<div class="demo">内容</div>';var uiMarker = new maptalks.ui.UIMarker( coordinate, // coordinate { draggable: true, single: false, content: dom });uiMarker.addTo(map).show();$('.demo')..
2021-05-08 18:30:08
643
原创 maptalks加载两个地图 让两个地图同步变化
// 监听地图变化map1.on('moving moveend', function (e) { map2.setCenter(e.target.getCenter());});map1.on('zooming zoomend', function (e) { map2.setCenterAndZoom(e.target.getCenter(), e.target.getZoom());});map1.on('pitch', function (e) { map2..
2021-04-28 11:49:43
529
原创 maptalks添加一个动态效果的marker
maptalks添加一个动态效果的markerif (animateId) clearInterval(animateId);animateId = setInterval(function () { marker.animate({ 'symbol': {'markerHeight': 60, 'markerWidth': 60} }, {'duration': 600}); setTimeout(function () { mark...
2021-04-23 11:16:07
712
原创 flex弹性布局
flex弹性布局采用flex布局的盒子称为：容器所有子容器自动变成容器成员，也称之为flex项目容器默认有两根轴，水平的主轴(mainaxis)和垂直的交叉轴(crossaxis)当开启flex布局后，flex项目会沿着主轴方向排列容器属性1.justify-content属性值:1.center:在主轴方向居中对齐2.flex-end:靠右对齐3.space-between:左右两端对齐，且项目中之间的距离相等...
2021-04-16 17:17:10
159
原创 sass 学习笔记
安装sass的方法：sass基于Ruby语言开发而成，因此安装sass前需要安装Rubywindow下安装SASS首先需要安装Ruby，先从官网下载Ruby并安装。安装过程中请注意勾选AddRubyexecutablestoyourPATH添加到系统环境变量安装完成后需测试安装有没有成功,运行CMD输入以下命令：ruby-vRuby自带一个叫做RubyGems的系统，用来安装基于Ruby的软件。我们可以使用这个系统来轻松地安装Sass和Compass。要...
2021-04-11 16:53:15
129
1
原创 判断手机浏览器的类型
//判断手机浏览器 function mobileBrowserType() { var uaWexin = navigator.userAgent.toLowerCase(); var ua = navigator.userAgent; var ipad = ua.match(/(iPad).*OS\s([\d_]+)/), isIphone = !ipad && ua.match(/(iPhone\...
2021-02-25 09:53:21
162
原创 JS判断浏览器的类型
//判断当前浏览类型 function BrowserType() { var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串 var isOpera = userAgent.indexOf("Opera") > -1; //判断是否Opera浏览器 var isIE = userAgent.indexOf("compatible") > -...
2021-02-25 09:46:02
114
原创 JS实现拖动模态框效果
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> body { padding: 0; margin: 0; } .box { display: .
2021-02-20 09:03:28
153
原创 echarts legend上半部分显示不全，像被截取了一块
在做echarts图标的时候，图例个别显示不全，像是被截取了一部分，在经历各种尝试后 发现给legend的textStyle中添加 lineHeight 属性 设置行高就可以完美的解决这个问题
2021-02-18 17:28:19
3564
3
原创 element ui table表格添加选中行高亮效果
table中有一个属性 highlight-current-row 可以实现表格当前选中的行高亮效果但是有些时候我们不是通过点击但是想要触发他的点击事件 类似于实现一种'trigeer'的效果所以我选择了用 row-click点击事件和 添加row-class-name属性首先写一个函数可以获取元素在数组中的下标 // 获取一个元素在数组中的下标 getArrayIndex(arr, obj) { var i = arr.leng...
2021-01-22 11:52:36
3156
1
原创 element-ui 级联选择器 添加rule表单必填验证规则
cascadeRule:[ {type:'array', required: true, message: "请选择XXX", trigger: "change"}],添加type:'array' 触发的方式为change
2021-01-14 18:25:22
2916
1
原创 微信小程序选择开始时间和结束时间控件
最近项目中遇到了要在小程序中选择一段时间的功能 由于小程序自带的picker-view 功能不完善 无法自动显示每个月的天数所在在原来的基础上进行了改进wxml代码 <view class="time"> <view class="time_text"> <view>开始时间：{{startyear}}年{{startmonth}}月{{startday}}日</view> </view
2020-12-25 17:41:55
5656
1
原创 2020-12-08 使用maptalks添加自定义marker 并且让marker有一个动态的效果
使用maptalks添加自定义marker 并且做一个动态的效果1.添加marker的方法（warnIcon是通过require方式导入的自定义图片）var marker = new maptalks.Marker(coordinate, { cursor: 'pointer', symbol: { markerFile: warnIcon.default, markerWidth: 40,
2020-12-08 10:23:40
2120
原创 v-model指令的本质
<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metaname="viewport"content="width=device-width,initial-scale=1.0"><metahttp-equiv="X-UA-Compatible"content="ie=edge"><tit...
2020-09-26 13:59:44
132
原创 webpack和webpack-dev-server安装配置遇到的大坑（使用npm run dev命令启用报错）
今天在学习webpack和webpack-dev-server的安装配置时，对项目进行打包配置 发现了一个坑首先使用命令 npm i webpack -D下载webpack然后使用命令npm i webpack-dev-server -D下载webpack-dev-server在package.json文件中配置使用npm run dev命令启用报错经过各种查资料发现是版本不兼容的问题，解决方案是更改webpack和webpack-dev-server的安装版本首先把之前
2020-09-04 15:01:52
949
原创 用leaflet在地图上绘制省的边界
首先要下载要绘制省的geojson数据http://datav.aliyun.com/tools/atlas/#&lat=31.765537409484374&lng=104.2822265625&zoom=4可以在该地址下载所需要的数据，（可以包含子区域，也可以不包含）设置边框的样式var style = { "color": "#ffffff", //边框颜色 "weight": 3, //边框粗细 "opacity": 0.4, //.
2020-08-11 18:20:36
4030
2
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人