自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(30)
  • 收藏
  • 关注

原创 vue 启服务常见报错信息

执行npm install 控制台报 Node Sass version 7.0.1 is incompatible with ^4.0.0.原因说是node-sass与环境不匹配。

2023-04-12 16:13:39 175 1

原创 vue+el-scrollbar 实现 返回顶部 功能

【代码】vue+el-scrollbar 实现 返回顶部 功能。

2023-03-14 16:02:18 928

原创 el-table的展开图标替换为其他图标

【代码】el-table的展开图标替换为其他图标。

2022-11-30 13:53:12 1362

原创 纯css实现动画效果

css 实现动画

2022-06-27 18:36:16 304

原创 vue使用vue-calendar-component日历组件(可直接使用)

vue-calendar-component

2022-06-15 14:28:21 2277 4

原创 vue 使用moment.js

下载momentmain.js引入获取日期

2022-06-02 20:21:07 372

原创 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 242

原创 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 1587

原创 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 550

原创 element 修改组件样式

文本框/deep/ .el-textarea{ width:720px; height:114px; } /deep/ .el-textarea__inner{ height:100%; }输入框

2022-05-11 10:25:39 527

原创 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 1120

原创 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 4032

原创 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 1754

原创 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 169330 40

原创 谷歌中安装 vue调试工具 vue-devtools

1. 打开谷歌浏览器,在右上角找到“三个点”主菜单按钮并点击,在出现的列表中点击“更多工具”选项,在出现的第二个小列表中选择“扩展程序”并点击进入。2. 在扩展程序窗口中,将右上角“开发者模式”勾选上。3. 进入 https://chrome.zzzmh.cn/info?token=nhdogjmejiglipccpnnnanhbledajbpd4. 在谷歌浏览器地址中输入 chrome://extensions/ 5. 把解压包里面的那个crx 文件直接拖拽过来,到空白位置 ,安装成功之

2022-04-21 14:46:30 2755

原创 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 796

原创 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 754

原创 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 93

原创 for in 和for of 的区别

for in 和for of 的区别

2022-01-18 14:04:48 167

原创 bind绑定过一次,第二次bind会改变this指向吗?

bind绑定过一次,第二次bind会改变this指向吗?

2022-01-18 11:02:14 572

原创 js 二维数组降一维数组

二维降一维

2022-01-17 17:31:27 708 1

原创 前端开发小技巧

当同时声明多个变量,可简写成一行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 256

原创 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 208

原创 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 171

原创 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 129

原创 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 259

原创 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 2952

原创 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 726

原创 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 564

原创 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 364 1

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除