- 博客(87)
- 收藏
- 关注
RSS订阅原创 monaco-editor 使用
/ 行号 取值： "on" | "off" | "relative" | "interval" | function。// Object.freeze是浅冻结只冻结一层,如果存在嵌套对象则深层对象仍然可以改变,深冻结函数递归实现。// 这是集合了上面引入的，字体，提示等等，这两个可以打开源码看下对比。// 辅助功能支持"auto" | "off" | "on"// 这里就是编辑器上面现实的代码，方便测试。// 这种引入方式，没代码提示，字体等等，// 开启代码检验，如果遇到。// 是否一直显示折叠。
2024-05-19 14:02:05
621
原创 js实现深拷贝(考虑循环引用)
第一种let obj = { name:"111", age:20, info:{ hobby:['aa','bb',{ a:1 }], career:{ teacher :111 }, style:{ color:'red', } } } function deepClone(origin,target){ let tag = targe
2022-05-13 15:04:08
608
原创 js拦截数组方法
let ARR_METHODS = [ 'push', 'pop', 'shift', 'unshift', 'splice', 'sort', 'reverse', ] let arr = [] let arr_methods = Object.create(Array.prototype) ARR_METHODS.forEach(methods=>{ arr_methods[methods] = function (
2022-04-02 15:42:22
551
原创 js数组与树结构转换
js数组与树结构转换 let arr = [ {name:"00",age:4,parent:0,id:1}, {name:"10",age:4,parent:0,id:2}, {name:"1",age:4,parent:1,id:3}, {name:"2",age:4,parent:2,id:4}, {name:"3",age:4,parent:3,id:5}, {name:"4",age:4,parent:2,id:6}, {name:"5"
2022-03-31 09:56:15
341
原创 js中数组对象与普通对象相互转换
js中数组对象与普通对象相互转换// 模拟数据let result = { shanghai:200, shandong:100, beijing:10, hunan:40, jiangxi:60, } let arrTrans = (data,valueName,keyName)=>{ let res = Object.keys(data).map(ele=>{ return {[valueName]:ele,[keyNa
2022-03-23 14:46:38
610
原创 异步迭代器for-await-for的使用
异步迭代器for-await-for的使用 const Time = (time)=> { return new Promise((resolve,reject)=>{ setTimeout(()=>{ resolve(time) },time) }) } async function text(){ let arr = [Time(2000),Time(1000),Time(3000)] // arr.ma
2022-02-25 17:35:20
627
原创 JS获取video,img的真实宽高
JS获取video,img的真实宽高video<video src="./1.mp4" id="video"></video> // htmlconst video = document.getElementById('video') video.addEventListener('canplay', function (e) { console.log(e.target.videoWidth); console.log(e.target.videoHeigh
2022-02-18 15:11:16
4475
原创 js判断两个数组是否相等
js判断两个数组是否相等 let a = [ {name:"1",age:10,color:"#fff",style:{'font-size':'1222px', 'display':'none',children:{name:"1-1"}}}, {name:"2",age:20,color:"#000",style:{fontSize:'24px', 'display':'block',children:{name:"2-1"}}} ] let b = [ {name:"
2022-01-10 16:42:28
319
原创 js中三目运算符优化
js中三目运算符优化let typeofa = 2let result = typeofa === 1 ? '值1' : typeofa=== 2 ? '值2' :'值3'console.log(result) // 值2//优化let map = { 1:"值1",2:"值2",3:"值3"}[typeofa]console.log(map) // 值2
2022-01-10 16:31:54
493
原创 js在数组中去掉重复的的某一个字段的值
js在数组中去掉重复的的某一个字段 getSetAlarmHostId3(arr1) { const res = new Map() // 连续写法 两个去重 return arr1.filter((item) => !res.has((item.名字一 | item.名字二)) && res.set((item.名字一| item.名字二), 1)) },...
2022-01-04 15:37:20
297
原创 vue+elementUI使用v-for循环出多个el-select下拉框，多个下拉框不受影响且反显
vue+elementUI使用v-for拿到循环出多个el-select下拉框，且多个下拉框不受影响<template> <div> <div v-for="(item, index) in from" :key="item.label"> <span>{{ item.label }}</span> <!-- arr[index] 每一个值的绑定@change="(val) => chageValu
2021-12-11 21:06:06
9062
5
原创 Date对象获取当前时间毫秒值(三种方式)
Date对象获取当前时间毫秒值(三种方式)// 方式一Date.now(); // 打印出当前时间的毫秒值// 方式二new Date() - 0; // 打印出当前时间的毫秒值// 方式三new Date().getTime() // 打印出当前时间的毫秒值
2021-12-01 09:37:37
6763
原创 vue+echarts实现省市区地图下钻
vue+echarts实现省市区地图下钻<div> <div id="china-pic" style="width:100vw,height:100vh"> </div></div>import * as echarts from "echarts";import "echarts/map/js/china";import $ from "jquery";import { provinces, cityMap, specia
2021-11-16 14:51:35
1214
原创 js中if优化
js中将多个if判断优化举例说明(判断是不是有空的值)// 判断下面的对象是不是有值为空 (通常下得写三个if判断)let params = { value: "11111", age: "1111", sex: ""}// 将要判断的条放到数组里面let arrValue = [params.value, params.age, params.sex] // [true, true, false]if (!arr1.includes(false)) { // 如果数组里面
2021-11-13 15:35:45
808
原创 Object.defineProperty()使用方法
先说说它的语法Object.defineProperty(obj, prop, descriptor)obj：必需。目标对象prop：必需。需定义或修改的属性的名字descriptor：必需。目标属性所拥有的特性>先看一个小例子 // 我这样写 let params = { name:'张三', sex:"男", age:20 }//跟这样写的区别let params = { name:'张三', sex:"男", } Object.defin
2021-11-09 10:01:19
157
原创 实现video截图并且在canvas上绘制矩形
实现video播放器截图并且在canvas上绘制矩形只展示核心代码 安装 video-playe 全局引入 有可能代码复制不完全，逻辑不变<div id="videoItem"> <video-player class="video-player vjs-custom-skin tine-font-size" ref="videoPlayer" :playsinline="true" :options="playerOptions"
2021-10-29 10:38:34
796
原创 vue拼接构造树型结构数据
vue拼接构造树型结构数据比如后端返给你的不是树形结构让你去拼接为一个树形结构/** * 构造树型结构数据 * @param {*} data 数据源 * @param {*} id id字段 默认 'id' * @param {*} parentId 父节点字段 默认 'parentId' * @param {*} children 孩子节点字段 默认 'children' * @param {*} rootId 根Id 默认 0 */export function handleT
2021-10-22 09:51:58
664
原创 el-cascader数据递归反显
<el-cascader v-model="arrArrList" :options="optionsArr" :props="propsOptions" collapse-tags ref="demoCascader" placeholder="11111" clearable></el-cascader>jsdata(){ propsOptions:{ // 权限 children: "children..
2021-10-20 11:10:43
767
原创 vue中样式跟随浏览器大小布局
在vue.config.js中引入npm i postcss-px-to-viewport -D css: { loaderOptions: { postcss: { plugins: [ require('postcss-px-to-viewport')({ unitToConvert: 'px', //将要转化的单位 viewportWidth:
2021-10-08 09:15:02
430
原创 vue递归element中的NavMenu
vue递归element中的NavMenu父组件<template> <div> <el-menu :default-active="activeIndex2" class="el-menu-demo" mode="horizontal" @select="handleSelect" background-color="#545c64" text-color="#fff" act
2021-07-29 11:35:49
237
1
原创 js如何将得到的秒转为分
js如何将得到的秒转为分t = 240Math.floor(t/60) + ':'+(t%60/100).toFixed(2).slice(-2)
2021-07-28 15:05:20
1025
原创 element-ui el-input 中的clearable和readonly两者同时使用
element-ui el-input 中的clearable和readonly两者同时使用element-ui el-input 中的clearable和readonly不能同时使用个人觉得clearable属于编辑功能，readonly属于禁止编辑，从逻辑角度来讲这俩属性肯定不能共存。那么偏要两个共存怎么办?上代码<el-input v-model="value" placeholder="请输入" :readonly="true" > //slot="s
2021-07-27 14:21:12
6390
3
原创 vue+echarts实现wordcloud
<div id="getWordCloud" style="height: 200px; width: 100%"></div>export default { require("echarts-wordcloud"); import echarts from "echarts"; methods:{ getWordCloud{ let myChart = echarts.init(document.getElementById("getWordCl
2021-07-20 16:49:01
571
原创 vue+echart实现某一个省下面的市级地图
vue+echart实现某一个省下面的市级地图我随便找了一个省<div id="shandong-map" style="width: 700px; height: 600px"></div>data(){ dataList: [ // 可以当作后台返回的数据 { label: "1", name: "济南市" }, { label: "4", name: "青岛市" }, { label: "1", name: "淄博市" },
2021-07-19 21:14:44
388
原创 vue+eChart实现省份地图
vue+eChart实现省份地图import echarts from "echarts";require("echarts/theme/macarons"); let chart = echarts.init(document.getElementById("shandong-map")); const shandong = require("@/map/json/province/hunan.json"); // 省份路径 echarts.registerMap("sha
2021-07-19 18:28:08
446
原创 vue+element的树结构根据选择的getCheckedNodes判断在第几层
vue+element的树结构拆为三层我是按照label来拆分的 其他逻辑类似<el-tree :data="data" show-checkbox node-key="id" ref="tree" highlight-current :props="defaultProps" @node-click="nodeClick" @check-change="checkChange" > </el-tree><el-button @
2021-07-17 17:59:16
4895
原创 nvalid prop: type check failed for prop “value“. Expected String, Number, got Array found in
data(){ return { this.value:"" }}// 在最后面拼接join()methods:{ // 事件 getVlaue(){ let obj1 = [] let obj3 = [] let obj2 = [] this.value = (([...new Set(this.obj3)]).concat(( [...new Set(this.obj2)])).concat(([...new Set(this.obj1)])))
2021-07-17 17:43:31
1984
原创 vue引入element中的input只能输入数字
vue引入element中的input只能输入数字oninput ="value=value.replace(/[^0-9.]/g,'')"
2021-07-16 18:49:37
91
原创 vue使用require.context 全局引入组件
vue 使用require.context 全局引入组件require.context(directory,useSubdirectories,regExp)directory:表示检索的目录useSubdirectories：表示是否检索子文件夹regExp:匹配文件的正则表达式,一般是文件名main.jsconst viewComponent = require.context("./viewComponent", true, /\.vue$/);viewComponent.keys(
2021-07-11 14:36:14
436
原创 如何在 vue 项目DOM中引入html 文件
如何在 vue 项目DOM中引入.html 文件index.vue<template src="./component.html"></template>component.html<div> conponent引入</div>如果引入多个只会展示最后一个<template src="./component.html"></template><template src="./conponent2.htm
2021-07-11 13:51:20
672
原创 js查询最近一个月,最近一周,本月,本年,上月,上年
js查询最近一个月,最近一周,本月,本年,上月,上年 <el-select v-model="value" placeholder="请选择" @change="getDateInput" > <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" > &
2021-07-08 17:03:42
520
原创 vue+echarts实现柱状图自动轮播功能
vue+echarts实现柱状图自动轮播功能<template> <div class="bar-echrats" :style="{ width: '500px', height: '400px' }"> <div id="scalesize" :style="{ width: '100%', height: '100%' }"></div> </div></template><script>imp
2021-07-07 16:48:03
2425
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人