- 博客(43)
- 收藏
- 关注
RSS订阅
原创 cesium vue 天地图 WMTS图层数据 绘制点、线、面 测距、测面积
cesium vue 天地图 WMTS图层数据 绘制点、线、面 测距、测面积
2023-03-29 14:51:02
1532
2
原创 给数组中所有对象加一个属性
新数组：array;原数组：list;给原数组list的对象加一个名为indexNum的属性，属性值为str let array = []; let list = [{name:'aa',age:11},{name:'bb',age:22},{name:'cc',age:33},]; list.map((item,index)=>{ array.push( ...
2018-09-28 11:17:19
19345
3
原创 vue2 打包报错 in ./src/main.js Thread Loader (Worker 0) Cannot read property ‘length‘ of undefined
vue2 项目可正常运行，打包报错in ./src/main.js Thread Loader (Worker 0) Cannot read property ‘length’ of undefined。vue-cli 使用 wokrer-loader 加载 web woker 时，使用 npm run build 有很大机率会打包失败。在vue.config.js 配置parallel: false，可以实现构建正式环境关闭thread-loader。
2024-03-01 08:48:05
649
转载 git 本地刷新远程分支
git branch -a : 查看全部(本地+远程)分支列表。git remote -v : 查看远程分支url。git branch -r : 查看远程分支列表。git branch : 查看本地分支列表。// 本地刷新远程分支。
2024-02-17 13:57:31
950
1
原创 el-table 合计 小数精度解决方案
el-table的合计列，会出现很多小数位，都是一位的小数合计，小数第二位不是0，取两位小数依然不对。
2023-05-15 11:10:57
1077
原创 vue :class
:class<div :class="{ active: isActive }"> {{ isActive }}</div><div :class="{ active: isActive, name1: nameActive }"> {{ isActive }}~{{ nameActive }}</div><div :class="nameActive ? 'name1' : 'name2'"> {
2020-11-25 10:00:46
335
转载 js中关于数组的常见用法
1.数组常见的排序方法(1)sort()–按照ascll字符编码排序,返回排序后的数组,会改变原数组，当数组中均为数字时，还需额外的处理，如下;例如：//第一种情况var b=['c','d','a','b'] b.sort(); console.log(b); //运行结果： ["a", "b", "c", "d"]----------------------------------------------------------//第二种情况<script type="
2020-11-18 08:55:30
186
1
原创 数组去重
const array = [ { id: 1, name: '张三' }, { id: 2, name: '李四' }, { id: 2, name: '王五' }, { id: 2, name: '赵六' } .
2020-11-17 14:50:04
171
原创 element 、 vant 时间区间设置
element （PC端）<el-date-picker type="date" placeholder="选择日期" v-model="form.checkTime" format="yyyy年MM月dd日" value-format="yyyy-MM-dd" :picker-options="pickerOptions" ></el-date-picker>data() { return { //
2020-11-17 09:02:36
1971
转载 屏蔽鼠标右键
1. oncontextmenu="window.event.returnValue=false" 将彻底屏蔽鼠标右键2. <body onselectstart="return false"> 取消选取、防止复制3. onpaste="return false" 不准粘贴4. oncopy="return false;" oncut="return false;" 防止复...
2020-11-12 15:27:36
257
转载 reduce
1、语法array.reduce(function(total, currentValue, currentIndex, arr), initialValue)reduce 为数组中的每一个元素依次执行回调函数，不包括数组中被删除或从未被赋值的元素，接受四个参数：初始值（或者上一次回调函数的返回值），当前元素值，当前索引，调用 reduce 的数组。callback （执行数组中...
2020-11-12 15:21:51
2528
原创 js 获取高度
盒子'box'宽：document.getElementById("box").offsetWidth盒子'box'高：document.getElementById("box").offsetHeight网页可见区域宽： document.body.clientWidth网页可见区域高： document.body.clientHeight网页可见区域宽： document.body.offsetWidth (包括边线的宽)网页可见区域高： document.body.offsetHeigh
2020-11-12 15:13:16
633
原创 关于面试
html(初级)行内元素有哪些？块级元素有哪些？空元素（void）有哪些？（1）行内元素：a，b，span，img，input，strong，label，button，select，textarea，em（2）块级元素：div，ul（无序列表），ol，li，dl（自定义列表），dt（自定义列表项），dd（自定义列表项的定义），p，h1-h6，blockquote（块引用）（3）空元素（void）：即没有内容的HTML元素。br（换行），hr（水平分割线），meta，link，input，img
2020-07-20 13:53:08
416
转载 vuex
一、Vuex是什么 Vuex是专门为Vuejs应用程序设计的状态管理工具。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。1、Vuex的构成 由上图，我们可以看出Vuex有以下几个部分构成：1）statestate是存储的单一状态，是存储的基本数据。2）Gettersgetters是store的计算属性，对state的加工，是派生出来的数据。就像computed计算属性一样，getter返回的值会根据它的依赖被缓存起来，且只有当
2020-05-27 08:46:47
181
原创 watch和computed
1. 各自处理的数据关系场景不同watch擅长处理的场景：一个数据影响多个数据 ，当需要在数据变化响应时，执行异步操作，或高性能消耗的操作，自定义 watcher 的方式就会很有帮助。computed擅长处理的场景：一个数据受多个数据影响 ，可以关联多个实时计算的对象，当这些对象中的其中一个改变时都会出发这个属性。具有缓存能力，所以只有当数据再次改变时才会重新渲染，否则就会直接拿取缓存中的数据。2. 工作流程watch1.初始化组件上配置的watcher属性2.对watcher属性可能的写
2020-05-20 16:13:10
261
原创 viewerjs 按钮可见性设置
viewer.js插件（图片预览） GitHub地址：https://github.com/fengyuanchen/viewerjs。如：不显示1:1，横向旋转，竖向旋转的按钮效果图：Viewer.setDefaults({ toolbar: { zoomIn: true, zoomOut: true, oneToOne: false, r...
2020-01-08 18:08:03
2885
原创 $set()处理数据更新但视图不更新的问题
踩了一个坑，给对象加完属性，打印出来了，但是页面没渲染出来。原因是：受 ES5 的限制，Vue.js 不能检测到对象属性的添加或删除。因为 Vue.js 在初始化实例时将属性转为 getter/setter，所以属性必须在 data 对象上才能让 Vue.js 转换它，才能让它是响应的。要处理这种情况，可以使用$set()方法，既可以新增属性,又可以触发视图更新。调用方法：Vue.se...
2020-01-04 16:14:15
2212
原创 css3滑动出现工具栏
效果图（gif有延迟，真实效果很流畅，拍gif截图的软件名为：GifCam）：代码(关键注释在css里)：<template> <div class="test3-container"> <div class="test3-bg" :class="{ show: show }"></div> <div clas...
2019-10-10 10:34:30
588
原创 时间戳转化年月日
toDate(baseTime) { let time = moment(baseTime).format() let d = new Date(time) let year = d.getFullYear() let month = '0' + (d.getMonth() + 1) let day = '0' + d.getDate(...
2019-10-08 17:43:03
554
2
转载 转载一个h5的迷宫小游戏
效果图：原文地址：https://blog.youkuaiyun.com/qq_40693171/article/details/100716766
2019-10-08 16:05:43
589
转载 css3实现卡片翻转效果
效果图：代码（主要部分注释在style里）：<template> <div class="test2-container"> <div class="re-box"> <div class="re-item"> <div class="re-item-front"> ...
2019-10-08 15:59:38
2089
1
转载 node遍历文件夹并读取文件内容
var fs = require('fs');var path = require('path');//解析需要遍历的文件夹var filePath = path.resolve('./dist');//调用文件遍历方法fileDisplay(filePath);//文件遍历方法function fileDisplay(filePath){ //根据文件路径读取文件，返回文件...
2019-07-23 13:31:01
1342
原创 vue修改el-table的样式，标题，列文字位置，颜色，流体高度，气泡
<template> <div class="test1-container"> <el-table :data="tableData" style="width:550px;margin:0 auto;margin-top:30px;" border :row-style="tableRowStyle" :header-cell-st...
2019-06-11 16:20:05
20087
6
转载 vue 框架 快速搭建企业级中后台产品原型
项目地址：https://github.com/PanJiaChen/vue-element-admin-site分析：https://panjiachen.github.io/vue-element-admin-site/zh/guide/#%E5%89%8D%E5%BA%8F%E5%87%86%E5%A4%87一个后台前端解决方案，它基于vue和element-ui实现。使用了最...
2019-05-13 17:06:28
2093
原创 js时间戳转成“年月日”格式
let baseTime = 1523721600000let time = moment(baseTime).format()let d = new Date(time);let batchDate = d.getFullYear() + '年' + (d.getMonth() + 1) + '月' + d.getDate() +'日'let batchTime = d.g...
2019-04-15 14:19:02
15185
2
原创 js 数组
1. 字符串和数组之间的转换var myData = 'Manchester,London,Liverpool,Birmingham,Leeds,Carlisle';var myArray = myData.split(',');myArray;var myNewString = myArray.join(',');myNewString; var dogName...
2018-12-27 13:56:30
291
转载 alert带有地址，重新写一个全局alert
window.alert = function(msg, callback) { var div = document.createElement('div'); div.innerHTML = '<style type="text/css">' + '.nbaMask { position: fixed; z-index: 1000; top: 0; rig...
2018-12-03 11:50:14
640
转载 字符串、数组 转换
1. 数组转字符串.join() 将数组中所有元素放到一个字符串中，并用指定的分隔符进行分割const a = [1, 2, 3]a.join(',') // "1,2,3"a.join('_') // "1_2_3"2. 字符串转数组.split() 将字符串以指定的分隔符分割成数组const a = '720_1_6'a.split('_') // [720, 1, ...
2018-12-03 11:41:59
183
转载 滚动条样式
滚动条全局样式：// 滚动条设置::-webkit-scrollbar { width: 10px;//y轴上的滚动条宽度 height: 10px;//x轴上滚动条高度}::-webkit-scrollbar-track { border-radius: 3px; /*滚动条的背景区域的圆角*/ background-color: #fdf8f5; /*滚动条的背景颜色*...
2018-12-03 11:37:30
1905
转载 【vue】在网页上增加水印
基于vue的架构中，在页面上增加水印，代码如下。watermark.js'use strict' let watermark = {} let setWatermark = (str) => { let id = '1.23452384164.123412415' if (document.getElementById(id) !== null) { d...
2018-11-29 09:57:32
1527
原创 关于路由跳转小方法
html:<div> <ul> <li v-for="(item,index) in routeList" :key="index" :class="{ select: selItem==index}" @click="routeSelect(index)"> {{item}} &am
2018-09-29 14:45:41
190
转载 深拷贝、浅拷贝区别，实现深拷贝的方法
如何区分深拷贝与浅拷贝，简单点来说，就是假设B复制了A，当修改A时，看B是否会发生变化，如果B也跟着变了，说明这是浅拷贝，拿人手短，如果B没变，那就是深拷贝，自食其力。此篇文章中也会简单阐述到栈堆，基本数据类型与引用数据类型，因为这些概念能更好的让你理解深拷贝与浅拷贝。我们来举个浅拷贝例子：let a=[0,1,2,3,4], b=a;console.log(a===b);...
2018-09-28 11:15:56
508
原创 定位（将子盒子定位到父盒子正中间）
父盒子：position：relative；子盒子：position:absolute;top:50%;left:50%;transform: translate(-50%, -50%);
2018-09-27 13:56:25
3865
原创 引入moment时使用中文
import moment from 'moment';moment.locale('zh-cn');或者moment.lang('zh-cn');即可显示中文
2018-09-27 13:54:56
11879
转载 flex布局异常（flex-grow：1）
用flex布局免去了清浮动的种种，但偶尔遇到异常情况：当用flex布局，给了一部分定值，而另一部分铺满flex-grow：1；给定值的部分会变化。这时候flex-basis (default:auto)就出场了，加上flex-basis：0；就不会异常了。看到一篇更详细和准确的文章：转自：http://zhoon.github.io/css3/2014/08/23/flex.htm...
2018-09-27 12:01:21
19975
2
转载 javascript 数组以及对象的深拷贝（复制数组或复制对象）的方法
javascript 数组以及对象的深拷贝（复制数组或复制对象）的方法前言在js中，数组和对象的复制如果使用=号来进行复制，那只是浅拷贝。如下图演示： 如上，arr的修改，会影响arr2的值，这显然在绝大多数情况下，并不是我们所需要的结果。 因此，数组以及对象的深拷贝就是javascript的一个基本功了。数组的深拷贝条条大道通罗马，实现数组的深拷贝，是有好几种方法的。举例如...
2018-08-16 10:36:53
565
原创 图片文件上传（上面一篇是预览）
图片上传和预览是一起的，分别写了两个组件（上传、预览），在上传中调用预览，因放一起有点多故分开写了写上传组件<template><div> <div class="pic-list" v-if="temp.fileList.length>0"> <p style="color:tomato;">已上传文件：&a
2018-07-11 16:27:46
583
原创 图片预览
写一个图片预览的组件<template> <div class="wrapper" :style="{height:wrapperHeight}"> <div class="imgName"> <span class="left"> {{imgIndex}} / {{imgData.length}}<...
2018-07-11 15:52:26
217
原创 双击可编辑
写一个双击事件<span @dblclick="edit" style="cursor:pointer;" ref="element">双击可编辑</span>写方法edit(element) { // 获取要编辑的文本内容 var oldHtml = element.target.innerText; // 创建一个新的 input 输...
2018-07-11 15:18:24
1840
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人