- 博客(30)
- 收藏
- 关注
原创 vue 启服务常见报错信息
执行npm install 控制台报 Node Sass version 7.0.1 is incompatible with ^4.0.0.原因说是node-sass与环境不匹配。
2023-04-12 16:13:39
158
1
原创 el-upload
<el-upload class="upload-demo" action="https://jsonplaceholder.typicode.com/posts/" multiple :on-change="handleUpload" :show-file-list="false" :limit="parseInt('1')"> <img src="../../assets/image/upload.png" alt /></e
2022-05-27 14:02:09
213
原创 vue自定义select组件
SelectBar组件<template> <div class="m-select-wrap"> <input :class="['u-select-input f16', color === 'blue' ? '' : 'white-color']" type="text" readonly @click="openSelect" @blur="onBlur" v-model="se...
2022-05-19 17:22:44
1541
原创 elementUI相关组件
el-tooltip 嵌套 el-popover <el-tooltip class="item" effect="dark" placement="top"> // 需要点击content 控制el-popover的显示隐藏 <div slot="content" @click="handleturn" class="content">更换</div> <el-popover placement="bottom" .
2022-05-17 10:16:46
510
原创 element 修改组件样式
文本框/deep/ .el-textarea{ width:720px; height:114px; } /deep/ .el-textarea__inner{ height:100%; }输入框
2022-05-11 10:25:39
482
原创 el-table与el-cascader 实现数据联动
<el-table :data="tableData" style="width: 850px"> <el-table-column type="index" label="序列" align="center"> </el-table-column> <el-table-column type="name" label="名称" width="260"> <template slot-scope="scope"> &l
2022-05-09 13:03:12
1027
原创 el-input-number 修改样式
<el-input-number v-model="num" controls-position="right" @change="handleChange" :min="1" :max="10" style="width:88px;"></el-input-number>// 设置输入框的高度/deep/ .el-input__inner { height: 32px; line-height: 32px;}/deep/ .el-input-number.
2022-05-07 16:48:50
3869
原创 cnpm全局环境变量配置
命令npm install -g cnpm --registry=https://registry.npm.taobao.org输入cnpm -v ,检测是否正常测试安装全局说明配置成功了 就可以安装vue 脚手架了cnpm install -g @vue/clivue -V
2022-04-22 09:33:08
1704
原创 nodejs安装及环境配置
安装环境本机系统:Windows 10 Pro(64位)Node.js : 14.17.5(64位)安装Node.js步骤《1》下载对应你系统的Node.js版本: https://nodejs.org/en/download/《2》选安装目录进行安装《3》环境配置《4》测试前期准备(1)进入官网下载地址 下载Node.js(2)如果要下载指定版本 既可选择下边链接开始安装(1)下载完成后,双击“node-v6.9.2-x64.msi”,开始安装Nod..
2022-04-21 17:02:49
167356
40
原创 谷歌中安装 vue调试工具 vue-devtools
1. 打开谷歌浏览器,在右上角找到“三个点”主菜单按钮并点击,在出现的列表中点击“更多工具”选项,在出现的第二个小列表中选择“扩展程序”并点击进入。2. 在扩展程序窗口中,将右上角“开发者模式”勾选上。3. 进入 https://chrome.zzzmh.cn/info?token=nhdogjmejiglipccpnnnanhbledajbpd4. 在谷歌浏览器地址中输入 chrome://extensions/ 5. 把解压包里面的那个crx 文件直接拖拽过来,到空白位置 ,安装成功之
2022-04-21 14:46:30
2712
原创 vue 递归处理tree结构
<el-tree :data="treeMenuData" ref="treeRef" :props="defaultProps" highlight-current node-key="id" default-expand-all /> "result": [ { "tmSonTask": { "id": "18a4f244224943cb98ad67bd48874edf", "title": "NN
2022-03-07 11:12:39
755
原创 promise.all 和promise.race区别
promise.all成功返回的是成功的数组失败返回的是失败的数据 一旦失败不会继续执行注意:返回的数组顺序不会改变,不会因为p2比p1速度执行的快就改变let p1 = Promise.resolve('aaa');let p2 = Promise.resolve('bbb')// let p3 = Promise.reject('ccc')let p4 = Promise.resolve('ddd')Promise.all([p1,p2,p4]).then(res=>{.
2022-01-18 16:32:29
723
原创 js 闭包
闭包的概念:在一个函数内有权访问另一个函数内部的变量在一个函数内部创建另一个函数闭包内的变量不会清空 会造成内存泄漏闭包的使用场景:返回值function fn() { var [a,b] = [1,2]; function getData(){ return a+b } return getData;}var fnc = fn()console.log(fnc());// 3函数赋值var fn2;function .
2022-01-18 15:10:07
81
原创 前端开发小技巧
当同时声明多个变量,可简写成一行let x;let y=20;// 简写let x,y=20;巧妙使用解构赋值let a,b,c;a=1;b=2;c=3;// 简写let [a,b,c] =[1,2,3]巧妙使用三元运算符let num = 20;let result;if(num >=20){ result = 'hhh'}else{ result = 'xxx' }// 简写let result = num >=20?'hhh':'x..
2022-01-14 14:05:57
214
原创 js 数组的方法
文章目录一、会改变原数组的方法二、不会改变原数组的方法三、数组的遍历迭代方法一、会改变原数组的方法puch:最后一位新增// 返回的是 数组的长度let arr = [1,3,4,5]console.log(arr.push('22'));// 5console.log(arr);// [1,3,4,5,'22']pop: 最后一位删除let arr = [1,3,4,5]console.log(arr.pop());// 5console.log(arr);// [1,3
2022-01-14 13:25:46
192
原创 webpack 基础使用
初始化package.jsonnpm init下载并安装webpacknpm install webpack webpack-cli -gnpm install webpack webpack-cli -D创建文件创建src文件,创建index.js 入口文件,代码如下:function add(x,y){ return x+y}console.log(add(1,2));运行指令一. 开发环境指令:webpack ./src/index.js -o ...
2022-01-07 15:26:16
158
原创 js 判断数据类型
基本数据类型:string、boolean、number、null、undefined引用数据类型:object (Data、function、Array、正则)es6新增:symbol: Symbol类型的对象永远不相等,即便创建的时候传入相同的值。 因此,可以用解决属性名冲突的问题(适用于多少编码),做为标记。BigInt:Javascript 中的任意精度整数,可以安全存储和操作大整数。 即始超出 Number 能够表示的安全整数范围。是 chrome 67中的新功能。type
2022-01-06 16:30:38
111
原创 vue 性能优化
编码阶段尽量减少data中的数据,data中的数据都会增加getter和setter,会收集对应的watcherv-for 遍历避免同时使用 v-if如果需要使用v-for给每项元素绑定事件时使用事件代理采用keep-alive缓存组件<template> <div id="app"> <keep-alive> <router-view/> </keep-ali.
2021-12-17 17:11:33
206
原创 js常用的操作json数组
var array = [ { "index_id": 119, "area_id": "18335623", "name": "满意度", "value": "100" }, { "index_id": 119, "area_id": "18335624", "name": "满意度", "value": "20" }, { "index_id": 119, "are
2021-11-16 10:52:37
2925
原创 vue el-input 只能输入数字校验
<el-input v-model='count' oninput="value=value.replace(/[^\d]/g,'')"/>oninput ="value=value.replace(/[^\d]/g,'')" //只能输入数字oninput ="value=value.replace(/[^0-9.]/g,'')" //只能输入数字和小数
2021-11-01 17:23:41
699
原创 js 正则校验
数字大于0小于100 正整数/^100$|^([1-9]|[1-9]\d)$/数字大于等于50/^([5-9][0-9]|[1-9][0-9]{2,})$/数字1-59/^([1-5][0-9]|[1-9])$/数字5-59/^[5-9]$|^[1-5][0-9]$/
2021-03-23 16:07:38
479
原创 el-cascader 高亮显示上一次的数据
这里写自定义目录标题<el-cascaderref="cascader"clearablev-model=“categoryName”:props=“moduleProps”:options=“changeTempCategoryList”size=“small”>解决方法: this.$refs.cascader.$refs.panel.activePath = [] this.$refs.cascader.$refs.panel.calculateChecked
2021-03-22 15:43:28
344
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人