- 博客(85)
- 收藏
- 关注
原创 vue 学习 -- day42(vue3 — watchEffect 函数)
watch的套路是:既要指明监视的属性,也要指明监视的回调。不用指明监视哪个属性,监视的回调中用到哪个属性,那就监视哪个属性。但computed注重的计算出来的值(回调函数的返回值),所以必须要写返回值。而watchEffect更注重的是过程(回调函数的函数体),所以不用写返回值//watchEffect所指定的回调中用到的数据只要发生变化,则直接重新执行回调。console.log('watchEffect配置的回调执行了')})
2024-01-10 14:52:11
491
原创 vue 学习 -- day39(vue3 — reactive 对比 ref)
一般来说,会把组件里面用到的数据封装到对象里给 reactive 加工成响应式对象(代理对象),这样读取或修改的时候就不用 .value 了。来实现响应式(数据劫持)。reactive通过使用。来实现响应式(数据劫持。
2023-12-06 17:31:09
727
转载 cookie & session
具体来说,浏览器首次向服务器发起请求时,服务器生成一个唯一标识符并发送给客户端浏览器,浏览器将这个唯一标识符存储在 Cookie 中,以后每次再发起请求,客户端浏览器都会向服务器传送这个唯一标识符,服务器通过这个唯一标识符来识别用户。安全标志,指定后,当secure为true时候,在HTTP中是无效的,在HTTPS中才有效,表示创建的cookie只能在HTTPS连接中被浏览器传递到服务器端进行会话验证,如果是HTTP连接则不会传递该信息,所以一般不会被且听到。存储在cookie中字符串的值。
2023-09-06 23:12:38
215
原创 vue 学习 -- day05(事件处理)
注意:方法不做数据代理(为了数据写到页面上去), 方法以后不改,等着被调用就可以了,所以没有必要做数据代理方法不要写到 data 中,因为这样会让 vue 很累,放到data中方法会做数据代理,且给它做数据代理没有意义
2023-08-21 09:36:09
299
原创 vue-seamless-scroll 滚动位置错误问题(纵向滚动)
错误的原因: 没有给 vue-seamless-scroll 组件设定高度,而是将高度设定在了其父节点上。解决方法:给 vue-seamless-scroll 组件设置高度。
2023-06-21 10:18:56
695
转载 element-ui 中 调用表单验证方法validate不执行回调
出现问题的原因:自定义表单校验规则的时候,每个判断最后都要确保callback执行到,否则不会执行validate回调
2022-04-07 23:40:56
1808
原创 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
1935
原创 换行符分割字符串
let idsArr = this.ids.split(/[(\r\n)\r\n]+/) || []; //匹配多个空行let idsArr = this.ids.split(/[(\r\n)\r\n]/) || []; //匹配单个空行
2022-04-04 13:38:04
935
原创 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
957
原创 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
2197
原创 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
166
原创 设置 tooltip-popper 宽度
.el-tooltip__popper { max-width: 500px; line-height: 180%; white-space: pre-wrap;}
2021-07-20 09:43:21
572
原创 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
129
原创 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
1540
原创 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
2172
原创 解决使用 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
3089
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
248
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
147
原创 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
117
转载 一文看懂js中的clientX,clientY,pageX,pageY,screenX,screenY
原文:https://www.cnblogs.com/jsydb/p/12344622.html
2021-02-02 14:20:33
596
转载 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
2064
原创 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
713
转载 class 继承
一些概念:父类===基类===超类子类===派生类介绍:ES5 中修改原型链来实现继承ES6 中通过 extends 来实现继承ES6 中 子类 必须调用 super 方法,来执行 父类(基类)的 constructor 函数子类在未调用 super 方法之前,如果使用了 this ,将会报错Object.getPrototypeOf可以通过Object.getPrototypeOf 来获取子类的父类。可以使用这个方法判断,一个类是否继承了另一个类。class ..
2021-01-13 21:28:32
324
原创 正则表达式
匹配模式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
516
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
254
原创 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
77
转载 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
453
转载 RAM & ROM 的理解
RAM(radom-access memory):随机存储器 ,是 CPU 直接交换数据的内部存储器,被称为 主存 或 内存。RAM 能够随时被读写,而且速度很快,通常被用作 操作系统 和 其他正在运行程序的临时数据存储媒介、输入或输出数据、中间结果 以及 与外存交换信息等。当电源关闭之后,RAM 中的数据不能被保留(掉电数据消失)。(如果想要数据被长期保存,可以储存到硬盘中(磁盘中))ROM(read-only memory):只读存储器,在装机之前数据被写好,在整机过程中只能读取数据,在电源关闭之.
2020-11-02 10:49:28
471
1
转载 navicat 连接数据库出现2059错误
解决方法:https://blog.youkuaiyun.com/leezsj/article/details/84800259
2020-10-27 16:03:37
319
转载 物理像素,逻辑像素(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
5608
转载 虚拟DOM 总结
什么是虚拟DOM?虚拟 DOM 是一个 javascript 对象,通过这个 javascript 对象来描述真实的 DOM 。(虚拟DOM :用 javascript 模拟真实的 DOM 结构)为啥真实DOM操作不推荐?真实DOM的操作,一般都会对某块元素的整体重新渲染。为啥虚拟DOM能提升性能当使用虚拟DOM时,在数据发生变化的时候,会对比前后差异,只需要局部刷新变化的位置就好了。https://segmentfault.com/a/11900000207338311. 虚.
2020-10-19 02:22:42
203
原创 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
7814
原创 通过 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
704
转载 echarts 初次加载完成 鼠标滑过图表时,图表抖动的解决方法
option中添加:tooltip: { transitionDuration: 0, //防止浏览器抖动 },原文地址:https://www.cnblogs.com/tabai/p/13626093.html
2020-09-27 01:51:19
820
转载 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
1922
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人