Embrace924-CSDN博客

原创 react 输入框 input 防抖 debounce

react input debounce1.需求当我输入文本时候，对文本进行设置处理（监控文本更新自动后请求接口）希望实时的设置输入文字不使用blur 但是change请求太过于频繁主要是针对输入框防抖处理2.处理使用 lodash 的 debounce3.遇到的问题浏览器报异常：Uncaught TypeError: Cannot read property 'value' of null。如果在react中想异步访问事件属性（如在setTimeout内...

2021-03-03 17:47:37 4443 1

原创了解 css 变量

css 变量又称为 CSS 自定义属性，它的值可以在整个文档中重复使用。设定值 --双横线获取值 var()函数变量的声明与使用因为 $被 Sass 用掉了，@被 Less 用掉了，为了不产生冲突，官方的 CSS 变量就用了--。声明变量的时候，变量名前面要加两根连词线--。body { // 声明 --font-color: #7F583F;}.main{ // 使用 color:var(--font-color);}css变量命名规则普通字符

2021-01-21 17:11:05 331

原创 vue 倒数60s 获取验证码

vue倒数60s 获取验证码1.页面代码 <Form ref="formValidate" :model="form" :rules="ruleValidate" :label-width="80" label-position="left" > <FormItem class="code-input" label="验证码" prop="authCode"> <In...

2021-01-12 17:03:17 239

转载最全的时间转换 ts

各种类型时间形式转为字符串time:时间值cFormat: {y}-{m}-{d} {h}:{i}:{s} {y}-{m}-{d} {h}:{i}:{s} {a} {y}/{m}/{d}// Parse the time to string const parseTime = ( time?: object | string | number | null, cFormat?: stri...

2020-11-30 10:53:46 2490

原创树形组件使用 vue-jstree 文档中心百度网盘

github:https://github.com/zdy1988/vue-jstree

2020-08-28 16:01:42 2476 3

原创 webstorm jsdoc /**回车的方法注释经常失效

1.光标选中添加 JSDoc style comments 的函数定义（或函数体里面），2.按 cmd + shift + a ，3.然后输入 fix doc comment 并执行。一般来说，不用输完，输个 fix 就够了。

2020-08-18 11:43:58 1512

原创 el-form 表单验证一个验证结果

:rules="rules"

2020-08-18 11:16:54 658

原创 transitionend 监听transition动画停止优化性能

问题：当有动画切换页面的时候同时切换后的页面会进行大数据量的图表渲染组合在一起导致动画卡顿方案：监听动画结束在进行图表渲染 getTransitions() { let t; for (t in this.transitions) { // t即transition，OTransition，MozTransition，WebkitTransition if (this.

2020-08-14 14:21:27 1276

原创 el-date-picker 最多只能选中一个月选中第一个日期后第二个日期给出可选范围限制

el-date-picker 选中第一个日期后第二个日期给出可选范围效果: 选中2020年5月13日之后前面4月13日到5月13日可选后面5月13日到6月13日可选 <el-date-picker v-model="value2" type="datetimerange" size="small" :picker-options="pickerOptio...

2020-08-07 10:19:48 14495 9

翻译 css 按钮渐变动画样式

案例地址/转载地址：http://www.jq22.com/code2759<div class="container"> <a class="btn btn-1">Hover me</a> <a class="btn btn-2">Hover me</a> <a class="btn btn-3">Hover me</a> <a class="btn btn-4">Hover me.

2020-07-28 15:46:49 1049 1

原创级联选择懒加载更改element-ui级联选择可选项

需求：先选类型再级联选择内容改变类型会改变级联选择的可选内容有食品家居用品衣服三个类型选择不同的类型后级联选择内容选某一公司然后懒加载出来该公司不同的商品选中某个商品结束关键点在于更改不同类型后级联选择的可选公司会变动并且选中公司后懒加载商品也会更新Element-ui的级联选择器<el-cascader :props="props"></el-cascader><script> let...

2020-07-24 14:57:51 1179

原创 Echarts coord应用画线

Echarts中标注线的情况option = { xAxis: [ { type: 'value', data: [1,2,3,4,5,6,7,8,9,10,11,12] } ], yAxis: [ { type: 'value' } ], series: [ { name: ...

2020-07-22 17:22:10 4899 2

原创 vue 默认布局顶部栏左侧栏右侧内容区域

<template> <div class="layout-default"> <auth></auth> <base-header></base-header> <div class="main-wrapper"&g...

2020-04-09 10:58:00 1969 1

原创 elementUI --- el-select 下拉框右侧放提示文字

需求：1.下拉框右侧需要显示对于备注文字<el-select v-model="ruleForm.tableName" placeholder="请选择数据表" @change="changeDataTable" popper-class="step-one"> <el-option v-for=...

2020-04-08 16:13:31 8199

原创表格动态加载行数，并在行数中验证输入情况,特别是行数之间输入不能相同

表格示例:该案例在动态表格中，验证同一个字段是否为空，是否超出最大限制字符，是否做不重名验证；示例中主要是验证对应别名（columnComment）字段，所有对每个别名字段循环一个el-formrules model对每个循环的 el-form-item中加入 :ref="`elFormItem${scope.$index}`" <el-table ...

2020-03-25 11:03:57 398

原创通过原生js检测CSS3的动画结束

<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA...

2020-03-18 10:56:08 435

原创自定义指令输入框只能输入数字，也不可输入e+-等符号

使用方法：v-number//最大值最小值小数点位数<el-input v-model.trim="scope.row.value" v-number="{ min: 0 ,precision: 0,max: 999 }" placeholder="非必填，0-999整数" size="small"></el-input></el-...

2020-03-13 15:05:23 1129

原创 vue各种加载loading集合

1. 普通旋转加载效果代码：<template> <button data-label="do it!" class="loading">do it! </button></template><script>export default { name: 'loader...

2020-02-17 17:32:01 1235

原创 vue 的 .sync 修饰符

https://cn.vuejs.org/v2/guide/components-custom-events.html#sync-%E4%BF%AE%E9%A5%B0%E7%AC%A6prop传入visible的值来控制innerVisibleinnerVisible根据visible的值来显示弹框当弹框在组件内部关闭时，发出$emit请求来改变visible的值<t...

2020-02-09 16:54:22 435

原创 vue-cli 发布一个npm 包

此项目中我们将element-ui 自定义主题，并且覆盖更改了一些样式作用：1.避免在每个项目中重新生成主题文件2.避免每个项目不一致性3.增加可维护性开始在src目录下建了一个index.js文件用于导出重新的less文件和element-ui编译出的font和css文件这里要注意先后顺序，相同样式的情况下后面的会覆盖前面的index为编译出的主题样式文件...

2019-12-24 11:02:18 883

原创 less 函数循环变量写法

案例上一个覆盖element-ui按钮 less@primary: #3a70df;@danger: #df3a25;@success: #2fcd77;@warning: #fba13b;@white: #ffffff;@black: #000000;@textBlack: #383838;@ccc: #cccccc;@colorlist: @danger, @pri...

2019-12-18 10:20:20 1838

原创多饼图应用

function chartTopPie() { var myChart = echarts.init(document.getElementById('char-top-pie')); var placeHolderStyle = { normal: { label: { sho...

2019-11-18 14:51:55 505

原创查看/统计代码行数

Installation 全局安装npm install -g cloc使用https://www.npmjs.com/package/cloc

2019-11-18 14:51:26 1567

原创遍历获取的元素

let els = document.getElementsByClassName('inputBox');Array.from(els).forEach(e => { e.disabled = 'disabled';});

2019-09-09 15:08:05 433

原创 element-ui 表格表头添加tooltip

只贴出来需要用到的地方tHeadData=[{"key":"X1","title":"班组"},{"key":"X3","title":"项目_单位"},{"key":"X9","title":"原料配比及消耗_矿槽原料灰_消耗"},{"key":"X27","title":"原料配比及消耗_干法除尘灰_消耗"},{"key":"X29","title":"原料配比及消耗_矿槽原...

2019-08-21 11:35:13 985

原创 vue directives 自定义指令 svg 加载动画

js：文件/** * Created by cld on 2019/7/31. */// js 文件import '../../assets/css/load.css';import load from '../../assets/image/load.svg';function getElementStyle(obj, attr) { if (obj.current...

2019-07-31 16:57:08 698

转载 shell创建文件

创建文件夹shell脚本添加可执行权chmod +x test_file.sh创建文件shell脚本#!/bin/bashfilePath="/root/test_file.zzz"if [ ! -f "$filePath" ];thentouch $filePathecho "hello liyang" > $filePathecho "文件创建...

2019-07-05 11:57:19 7273

转载 20 个让你效率更高的 CSS 代码技巧

JavaScript作者：过冬https://segmentfault.com/a/1190000019542534在这里想与你分享一个由各大CSS网站总结推荐的20个有用的规则和实践经验集合。有一些是面向CSS初学者的，有一些知识点是进阶型的。希望每个人通过这篇文章都能学到对自己有用的知识。1.注意外边距折叠与其他大多数属性不同，上下的垂直外边距ma...

2019-07-05 09:26:41 261

原创 iconfont引入后使用所有的字体图标都是小正方形,不正常显示 font-class引用

按着官网的例子使用出来小长方形官网例子：官网的例子使用不成功~~~~~~~~~~~~~~~小机灵鬼换了一种方法 class="icon font_family icon-xxxx"例如<i class="icon font_family icon-wenbenshaixuan"></i><span class...

2019-06-28 14:53:49 8410 4

原创证书过期 unable to access

证书过期Push failed: Failed with error: unable to access 'https://gitlab.segma.tech/frontend/smart_dosing.git/': SSL certificate problem: certificate has expired解决方法gitconfighttp.sslVeri...

2019-06-24 16:15:11 562

转载 vue中$refs, $emit, $on的使用

1.$refs的使用场景父组件调用子组件的方法，可以传递数据。父组件：<div id="app"> <child-a ref="child"></child-a> <button @click="getMyEvent">点击父组件</button><div><script> ...

2019-06-20 15:15:23 832

原创根据选中时间或者当前时间时间获取前一个月后一个月等时间

根据选中时间或者当前时间时间获取前一个月后一个月等时间//当前时间的前一个星期new Date().setDate(new Date().getDate() - 7), new Date().getTime()//当前时间的前一个月new Date().setMonth(new Date().getMonth() - 1)//choiceDate ...

2019-06-18 17:29:02 3081

原创 nginx代理webSocket 和eventSource 请求超时连接不通但是本地可以得问题

nginx代理webSocket 和eventSource 请求超时连接不通但是本地可以nginx代理出了问题不能普通代理一样要先发起普通请求代理然后通过一些属性再次转换#常用配置location /api/ { proxy_pass http://请求地址/;}#eventSourcelocation /es/ { proxy_pass ht...

2019-06-17 16:45:35 5814

原创 VUE eslint规范验证

VUE eslint验证npminstall--save-deveslintbabel-eslintvue-eslint-parser@2.0.1-beta.2babel-eslinteslint-plugin-vue@3eslint-config-alloyhttps://www.npmjs.com/package/eslint-config-alloy...

2019-05-28 11:16:12 825

转载 webstrom 快捷键

webstrom 快捷键Ctrl快捷键介绍 Ctrl+F 在当前文件进行文本查找（必备） Ctrl+R 在当前文件进行文本替换（必备） Ctrl+Z 撤销（必备） Ctrl+Y 删除光标所在行或删除选中的行（必备） Ctrl+X 剪切光标所在行或剪切选择内容 Ctrl+C 复制光标所...

2019-05-28 10:45:10 784

原创自定义element-ui主题

https://www.cnblogs.com/cutemantou/p/8899788.html

2019-04-23 19:44:26 457

原创 vue优化路由懒加载

路由懒加载当打包构建应用时，JavaScript 包会变得非常大，影响页面加载。如果我们能把不同路由对应的组件分割成不同的代码块，然后当路由被访问的时候才加载对应组件，这样就更加高效了。结合 Vue 的异步组件和 Webpack 的代码分割功能，轻松实现路由组件的懒加载。首先，可以将异步组件定义为返回一个 Promise 的工厂函数 (该函数返回的 Promise 应该 resolve...

2019-04-10 09:28:26 431

转载相同的字符串被判断为不相等问题

JS两个相同的字符串被判断为不相等问题今天在写js的时候，遇到一个奇怪的问题，明明两个字符串相等，用alert()打印出来都一样，typeof的结果都是string，仔细查看过了首尾都没有空格。可是用a==b却判断为不相等虽然两个字符串肉眼看上去没有区别，但是用encodeURIComponent()处理后可能不一样，(我处理后发现有个字符串前面有 %EF%BB%BF，另一个...

2019-04-08 10:10:00 1388

原创保留小数位数的时候出现0000000001

//关于js失精算法你都遇到哪些，让我们一起来细数一下吧 console.log(0.07*100);//7.000000000000001 console.log(0.1+0.2);//0.30000000000000004 //........事实上，0.1 + 0.2 这这样的 0.1000000000000000...

2019-03-15 16:49:54 1872

原创 vue打包生成环境优化

优化方法：路由懒加载 src/router.js 改成import引入2.按需引入echarts、loadash、element等，具体查看相关官方文档3.vue.config.js设置生成环境关闭sourceMap，设置productionSourceMap为false即可去掉css的sourceMapproduct...

2019-02-12 11:15:19 730