- 博客(85)
- 收藏
- 关注
RSS订阅原创 vue 学习 -- day42（vue3 — watchEffect 函数）
watch的套路是：既要指明监视的属性，也要指明监视的回调。不用指明监视哪个属性，监视的回调中用到哪个属性，那就监视哪个属性。但computed注重的计算出来的值（回调函数的返回值），所以必须要写返回值。而watchEffect更注重的是过程（回调函数的函数体），所以不用写返回值//watchEffect所指定的回调中用到的数据只要发生变化，则直接重新执行回调。console.log('watchEffect配置的回调执行了')})
2024-01-10 14:52:11
440
原创 vue 学习 -- day39（vue3 — reactive 对比 ref）
一般来说，会把组件里面用到的数据封装到对象里给 reactive 加工成响应式对象（代理对象），这样读取或修改的时候就不用 .value 了。来实现响应式（数据劫持）。reactive通过使用。来实现响应式（数据劫持。
2023-12-06 17:31:09
673
转载 cookie & session
具体来说，浏览器首次向服务器发起请求时，服务器生成一个唯一标识符并发送给客户端浏览器，浏览器将这个唯一标识符存储在 Cookie 中，以后每次再发起请求，客户端浏览器都会向服务器传送这个唯一标识符，服务器通过这个唯一标识符来识别用户。安全标志，指定后，当secure为true时候，在HTTP中是无效的，在HTTPS中才有效，表示创建的cookie只能在HTTPS连接中被浏览器传递到服务器端进行会话验证，如果是HTTP连接则不会传递该信息，所以一般不会被且听到。存储在cookie中字符串的值。
2023-09-06 23:12:38
188
原创 vue 学习 -- day05（事件处理）
注意：方法不做数据代理（为了数据写到页面上去）, 方法以后不改，等着被调用就可以了，所以没有必要做数据代理方法不要写到 data 中，因为这样会让 vue 很累，放到data中方法会做数据代理，且给它做数据代理没有意义
2023-08-21 09:36:09
282
原创 vue-seamless-scroll 滚动位置错误问题（纵向滚动）
错误的原因： 没有给 vue-seamless-scroll 组件设定高度，而是将高度设定在了其父节点上。解决方法：给 vue-seamless-scroll 组件设置高度。
2023-06-21 10:18:56
566
转载 element-ui 中 调用表单验证方法validate不执行回调
出现问题的原因：自定义表单校验规则的时候，每个判断最后都要确保callback执行到，否则不会执行validate回调
2022-04-07 23:40:56
1723
原创 el-textarea 禁止输入换行
<el-input type="textarea" :placeholder="placeholder" resize="none" @input="handleTextareaInput" @keydown.enter.native="handleTextareaKeydown" v-model="ids" />handleTextareaKeydown(){ let e = window.eve.
2022-04-04 13:40:25
1846
原创 换行符分割字符串
let idsArr = this.ids.split(/[(\r\n)\r\n]+/) || []; //匹配多个空行let idsArr = this.ids.split(/[(\r\n)\r\n]/) || []; //匹配单个空行
2022-04-04 13:38:04
886
原创 el-textarea 禁止输入非数字、非换行以外的字符
<el-input type="textarea" :placeholder="placeholder" resize="none" @input="handleTextareaInput" @keydown.enter.native="handleTextareaKeydown" v-model="ids" />handleTextareaInput(value){ if (value) ..
2022-04-04 13:36:04
907
原创 el-table 动态设置高度失败问题解决
将设置高度的方法放到this.$nextTick中执行！mounted() { this.setTableHeight();},methods: { setTableHeight(){ const $refs = this.$refs; const totalHeight = $refs.wrap.offsetHeight; const topHeight = $refs.top.$el.offsetHeight; const btm.
2022-04-04 00:36:42
2041
原创 git学习（17）—— 学习总结
Git的常用命令：Git的官方网站：http://git-scm.comGit的gitignore配置文件：https://github.com/github/gitignore常用命令配置git config --global user.name 'Your Name'git config --global user.email 'Your Email'git config --global color.ui true创建版本库git init 初始化本地仓库git
2021-09-10 13:02:27
127
原创 设置 tooltip-popper 宽度
.el-tooltip__popper { max-width: 500px; line-height: 180%; white-space: pre-wrap;}
2021-07-20 09:43:21
514
原创 el-input 只能输入数字
<el-input maxlength="9" v-model="form.peopleNum" placeholder="请输入人数" @input="form.peopleNum = form.peopleNum? form.peopleNum.replace(/[^\d]/g,'') : ''" />
2021-07-16 14:29:11
110
原创 echarts lable引入背景图片不生效问题
//错误的写法（多写了 image:// -_-！）: ????//let chartLabelBg = `image://${require('../../../../../assets/images/statistics/bg-label.png')}`;//正确的写法：????let chartLabelBg = `${require('../../../../../assets/images/statistics/bg-label.png')}`;//切记！！背景图片使用时千万不要在前面加上
2021-06-28 12:06:52
1337
原创 element-ui 修改 el-popper 的样式（使用scss 全局修改）
.el-tooltip__popper{ //上、下、左、右 四个方向的箭头 @each $direction in top, bottom, left, right { //边框色 &[x-placement^=#{$direction}] .popper__arrow{ border-#{$direction}-color: $tooltipBorderColor; &::after{ //背景色 bord.
2021-06-08 20:05:04
2073
原创 解决使用 vue-clipboard2 完成一键复制功能时 点击复制按钮没有反应问题（无报错）
产生问题的原因是绑定的值是undefined解决方法：<el-button v-clipboard:copy="form.subject || ' '" v-clipboard:success="onCopySuccess" v-clipboard:error="onCopyError" :disabled="false">复制</el-...
2021-05-14 16:05:58
2935
2
原创 创建对象的四种方式 & 判断数据类型
1. 对象字面量var obj = {}2. 内置构造函数创建var obj = new Object();3. 工厂函数function createObject(name, age, ...) { var obj = {}; obj.name = name; ......}var obj = createObj('name', ...)4. 自定义构造函数创建function createObj(name, age, ...) {...
2021-02-13 17:36:17
222
3
原创 canvas练习-小球碰壁折返
<!-- * @Descripttion: * @version: * @Author: sueRimn * @Date: 2021-02-03 21:19:42 * @LastEditors: sueRimn * @LastEditTime: 2021-02-03 22:22:50--><!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" />.
2021-02-03 22:34:24
129
原创 canvas练习-炫彩小球
<html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> </head> <body> <canvas id="myCanvas".
2021-02-02 14:50:58
96
转载 一文看懂js中的clientX，clientY，pageX，pageY，screenX，screenY
原文：https://www.cnblogs.com/jsydb/p/12344622.html
2021-02-02 14:20:33
567
转载 vscode less 自动编译——easy less 插件使用
第一步：安装 easy-less第二步：在 sttings.json 中进行设置{ "less.compile": { "compress": true, // 是否删除多余空白字符 "sourceMap": false, // 是否创建文件目录树，true的话会自动生成一个 .css.map 文件 "out": true, // 是否编译输出文件 "outExt": ".css", // 输出文件的后缀,默认为.css.
2021-01-26 21:31:25
1976
原创 echarts 使用中需要注意的事
折线图、柱状图等一定要在配置里声明 xAxis 和 yAxis。 当 yAxis/xAxis 的 type 值为 'category'(是类目轴) 时在 yAxis/xAxis 中设置data值才有效。 当某数据不存在时（ps：不存在不代表值为 0），可以用'-'或者null或者undefined或者NaN表示。 柱状图设置圆角的属性是barBorderRadius 而不是 borderRadius!!!(然而文档里写的是borderRadius)。 silent ——图形是否不...
2021-01-15 10:47:33
658
转载 class 继承
一些概念：父类===基类===超类子类===派生类介绍：ES5 中修改原型链来实现继承ES6 中通过 extends 来实现继承ES6 中 子类 必须调用 super 方法，来执行 父类（基类）的 constructor 函数子类在未调用 super 方法之前，如果使用了 this ，将会报错Object.getPrototypeOf可以通过Object.getPrototypeOf 来获取子类的父类。可以使用这个方法判断，一个类是否继承了另一个类。class ..
2021-01-13 21:28:32
308
原创 正则表达式
匹配模式i —— 忽略大小写 g—— 全局匹配 m —— 多行匹配（要匹配的字符串中间有换行，通常和 g 一起使用）var str1 = 'ababab';var str2 = 'ab\nabc';var regexp1 = /ab/g;var regexp2 = /ab/m;var regexp3 = /^ab/g;var regexp4 = /^ab/m;var regexp5 = /^ab/mg;var res1 = str1.match(regexp1);var r.
2020-12-26 23:33:39
406
1
转载 bind / call / apply 用法整理 以及 自定义实现
共同点：改变 this 指向区别：call 和 apply 的区别：传参的方式不同call(obj, param1, param2, param3......) apply(obj, [param1, param2, param3......])bind 与 call / apply 的区别：bind 返回的是一个新的函数，需要再调用一下才会执行 bind 的传参方式同 call， 即：bind(obj, param1, param2, ...) call / apply 是立即执行
2020-12-04 16:03:13
219
原创 js 继承
var inherit3 = (function(Target, Origin) { var F = function() {}; //私有变量，防止被修改 return function() { F.prototype = Origin.prototype; Target.prototype = new F(); // 用 F 作为中间层，防止Origin的原型在修改Target.prototype时被修改 Target.prototyp.
2020-12-04 10:45:52
60
转载 class 私有变量
私有变量：只能在类的内部访问的变量，无法在外部访问实现私有变量的方式：（一）约定命名eg.class A { constructor(x) { this._x = x; } showX() { return this._x; }}console.log(a._x); // abcconsole.log(a.showX()); // abc优点：简单、快捷缺点：可以通过 for ... in 访问到（二）闭
2020-12-01 22:45:58
424
转载 RAM & ROM 的理解
RAM（radom-access memory）：随机存储器 ，是 CPU 直接交换数据的内部存储器，被称为 主存 或 内存。RAM 能够随时被读写，而且速度很快，通常被用作 操作系统 和 其他正在运行程序的临时数据存储媒介、输入或输出数据、中间结果 以及 与外存交换信息等。当电源关闭之后，RAM 中的数据不能被保留（掉电数据消失）。（如果想要数据被长期保存，可以储存到硬盘中（磁盘中））ROM（read-only memory）：只读存储器，在装机之前数据被写好，在整机过程中只能读取数据，在电源关闭之.
2020-11-02 10:49:28
417
1
转载 navicat 连接数据库出现2059错误
解决方法：https://blog.csdn.net/leezsj/article/details/84800259
2020-10-27 16:03:37
298
转载 物理像素，逻辑像素(pt)，css像素(px)，像素比(dpr)都是什么？px，em，rem等 都是什么？有什么区别？
（像素）分辨率：手机屏幕的实际像素尺寸。像素密度(ppi/dpi)：(pixels per inch )每英寸的长度上排列的像素点数量（注：这里的像素， 指的是device pixels），是屏幕分辨率的单位。（这项指标是连接数字世界与物理世界的桥梁），1英寸是一个固定长度，等于2.54厘米，大约是食指最末端那根指节的长度。像素密度越高，代表屏幕显示效果越精细。（比如 iphone4 的屏幕尺寸是3.5，像素分辨率是 960 * 640px ， 则 。物理像素：设备屏幕实际拥有的像素点。一个...
2020-10-19 02:41:42
5356
转载 虚拟DOM 总结
什么是虚拟DOM？虚拟 DOM 是一个 javascript 对象，通过这个 javascript 对象来描述真实的 DOM 。（虚拟DOM ：用 javascript 模拟真实的 DOM 结构）为啥真实DOM操作不推荐？真实DOM的操作，一般都会对某块元素的整体重新渲染。为啥虚拟DOM能提升性能当使用虚拟DOM时，在数据发生变化的时候，会对比前后差异，只需要局部刷新变化的位置就好了。https://segmentfault.com/a/11900000207338311. 虚.
2020-10-19 02:22:42
191
原创 npm install --registry=https://registry.npm.taobao.org 报错
npm ERR! code EPERMnpm ERR! syscall unlinknpm ERR! path E:\myspace\vue-element-admin\node_modules\.staging\@hapi\joi-33d00 ac9\lib\errors.jsnpm ERR! errno -404...
2020-10-13 10:51:14
7646
原创 通过 Object.assign / {...obj1, ...obj2} 实现拷贝对象，合并对象属性时需要注意的问题
当 多个源对象含有相同的属性名时，后面的源对象的属性值会覆盖前面的比如：let a = { test: 'aa' }; let b = { test: 'cc' }; let c = {...a, ...b}; 或者 let d = {}; Object.assign(d, a, b);console.log('c', c); // {test: 'cc'}console.log('d', d); // {test: 'cc'}所以，需要注意的是：当多个源对象的相同的属性..
2020-10-06 23:59:54
670
转载 echarts 初次加载完成 鼠标滑过图表时，图表抖动的解决方法
option中添加：tooltip: { transitionDuration: 0, //防止浏览器抖动 },原文地址：https://www.cnblogs.com/tabai/p/13626093.html
2020-09-27 01:51:19
791
转载 vue 中获取文件数据的两种方式
// 例1：<input type="file"ref="file"/><span @click="getFile">提交</span>getFile(){console.log(this.$refs.file.files)}// 例2：<input type="file"@change="getFile"/>getFile(e){console.log(e.target.files)...
2020-09-25 14:53:40
1863
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人