兔子的博客

原创 element-ui的el-tree使用-懒加载状态下el-tree的叶子节点才显示多选框，父节点则隐藏多选框

项目要求：多选树得叶子节点数据。

原创 优化elemen-ui的el-table的tree树结构因数据过多卡顿问题

最近遇到一个要在elemen-ui的el-table放一个树结构的表数据但是因为数据实在过多，而且列也有四五列，还有操作列dom操作频繁导致页面非常的卡顿网上看了很多种方法以及elementui的官方方法使用lazy和load方法终于解决。

原创 使用antdpro的EdittableProTable中使用form.setFiledsValue踩坑

editableKeys可以在官网的edtitableProTable看到，大概就是保存了点击编辑时的key指，返回的是一个数组。当表格中编辑时，此时使用form.getFiledsValue()返回的值不是一个单一的对象，所以使用普通的设置不行。下拉框1和2的值是一个编码和名字的联动关系，1变化会带动2，2变化会带动1的一个联动作用。：使用antdpro的editprotable编辑两个下拉框，且下拉框是一个。这里主要是记录使用form.setFiledsValue()时的用法。

原创 关于antdpro的EdittableProTable编辑时两个下拉搜索框的数据联动以及数据回显（以及踩坑）

需求：使用antdpro的editprotable编辑两个下拉框，且下拉框是一个。下拉框1和2的值是一个编码和名字的联动关系，1变化会带动2，2变化会带动1的一个联动作用。（最后有略完整的代码，但是因为公司项目问题，删掉了一些不必要的代码，不确保运行成功）我使用的是renderFormItem进行渲染Select，并绑定了form。

原创 ant-design-pro的可编辑表格editprotable的遇到的一些小问题

需求：1、使用可编辑表格实现对某一行表格的数据进行编辑，对输入内容控制必须低于同行某一数据2、解决搜索数据和列名展示不同，和不可编辑的列不展示在搜索框实现效果。

原创 【安装】阿里云轻量服务器安装Ubuntu图形化界面(端口号/灰屏问题）

izbp166dsac66tx****:1表示在服务器上启动的VNC的端口号，其中izbp166dsac66tx****为主机名。由于一开始没注意看，在下载vnc之后连接的端口号是5901，其实应该连接启动vnc的端口号。在官网的配置文件加上这个博主的就运行成功了。## 3、连接之后屏幕黑屏。

原创 【layui-全部导出】layui添加全部导出按钮

获取后端接口返回的全部数据，使用layui的table自带的exportFile进行导出。1、在表单的左边自定义头部工具栏添加一个全部导出的按钮。2、给工具栏事件添加绑定事件。

原创 《记录》chariles配置

charles配置，记录一下

原创 vue使用echarts报错：Error: Initialize failed: invalid dom.

解决：因为数据返回较慢，获取接口数据写在mounted中，但是当切换页面时，dom被销毁，但是接口数据仍在等待，但是当切换页面后，接口数据返回，要渲染图表时，此时dom找不到，这个时候加一个判断就行了。bug出现：因为后端数据返回较慢，当我在数据未返回之前切换了当前页面，浏览器就会报错：未初始化dom：Error: Initialize failed: invalid dom.功能背景：使用后端返回数据渲染图表，我是在获取数据之后才渲染的图表。

原创 记录-vue和React渲染html字符串

当获取后端数据，例如富文本的数据，通常前端获取到是一串html的字符串。记录vue和react渲染html字符串的方式。

原创 记录：接口对接-json格式参数无法传输双引号

记录一下使用富文本作为内容参数传递时，有时候会有双引号的存在，比如复制网页内容时，会把样式也传递过来，参数类似于：“

原创 element-ui的datePicker：关于中国时区和世界标准时间格式相差8小时问题

element-ui的datePicker默认使用的时间格式是世界标准时间。如果需要的格式是年-月-日，或者月-日-时等都可以用这种方法。这里后端需要的参数就是这个时间格式，就是时区有问题。但是由于时区问题，时间会有8小时的差别。使用value-format属性。...

原创 项目-h5列表跳转详情，实现后退不刷新，修改数据则刷新的功能(记录滚动条)

最近项目遇到一个需求，要求实现从列表进入详情，详情页面点击后退，页面停留在进入详情时的列表也main，即实现后退不刷新的功能，但详情也可以改变列表数据，提交详情数据需要重新获取列表数据

原创 小程序错误--Super expression must either be null or a function at _inherits

小程序报错：Super expression must either be null or a function at _inherits在做小程序的时候，使用Taro作为框架，在使用form的时候，使用了官网给的例子：发现一直报这个错，为什么官网的例子也错上网搜说是大写什么的没写好后面发现是继承的Component的问题，应该继承React.Component修改之后的import React from 'react'import { AtForm, AtInput, AtButton }

原创 vuex的mutation/action个人学习总结

原创 vue路由传参方法汇总--path/name

path:路径name：组件名1.1、path// 带有路径的对象router.push({ path: '/users/eduardo' })// 我们可以手动建立 url，但我们必须自己处理编码router.push(`/user/${username}`) // -> /user/eduardo1.2、path+query/name+queryquery传参的时候，以path，name效果一样// 带查询参数，结果是 /register?plan=privateroute

原创 vue-批量删除遇到的问题

使用element-ui的表格后端需要的数据：？ids=1&ids=2使用axios.delete进行删除axios.delete(url,params)params是对象前端传递数据： batchDelete(){ let selectData = this.$refs.multipleTable.selection // 将id提取出来 for(let i=0;i<selectData.length;i++){ this

原创 记录解决关于vue的跨域问题

使用前后端分离的时候，会产生的跨域问题。而根据项目的创建会生成不同的vue项目结构使用webpack创建：配置在vue.config.js下使用脚手架vue-cli ：配置在config文件夹下例如我需要获取的数据地址：http://106.14.92.224:9097/api/client/covid19一、vue中有config文件夹时1、在config文件夹下面的index.js添加dev: { // Paths assetsSubDirectory: 'static

原创 ES6笔记

1、变量声明​ 弱类型​ var： 1、重复声明 2、变量提升 3、没有局部作用域（函数）​ let： 1、不可重复声明 2、不存在变量提升 3、存在局部作用域 4、 暂时性死区：在⼀个代码块中，let可以锁定某个变量​ const: 1、常量，只能赋值一次的变量，其他与let保持相同特性let a = 3;a++; // 4const b = 3;b++; //errorconst obj = {age:1}obj.age++; // age 2

原创 Ajax和axios的区别

1.查询字符串​ key1=val&key2=val22.json字符串​ ‘{“key1”:“val”,“key2”:“val2”}’3、如何利用$.ajax向后台发送json字符串数据？​ 1.将参数转换为json字符串​ JSON.stringify( )​ 2.将请求头设为json格式​ contentType = 'application/json’4、Ajax和axios的区别Ajaxaxios自动将对象转换为查询字符串会自动将对象转换为

原创 JSON.stringify和JSON.parse以及qs.stringify()

JSON.StringifyJSON.parseqs.stringify()将对象、数组转换成字符串；json.parse()将字符串转成json对象。qs.stringify()将对象 序列化成URL的形式’ { “name”：” XXX“， “age”:15,} ’{ name：” XXX“， age:15,}let params = { name: ‘XXX’, age: 15 }; qs.stringify(...

原创 JAVA:解决idea中spring项目pom文件的 spring-boot-maven-plugin报红问题并打包

spring-boot-maven-plugin报红问题：打包问题出现：Cannot resolve plugin org.springframework.boot:spring-boot-maven-plugin:2.0.参考：https://blog.csdn.net/weixin_46146718/article/details/114023308修改plugin<plugin> <groupId>org.apache.maven.plugins</gro

原创 vue+spring：前端拿数据显示到页面的简单项目

最近在学vue，因为先学过一点的后端知识，所以有点想不通前后端连接的方式。这个案例是跟一个知乎博主写的，但是一直前端页面出不来，今天换了一个表单组件就运行成功了，所以记录下来。使用了mybatis连接数据库，spingboot和swagger连接，以及vue和element-ui的一个表单组件。数据库CREATE TABLE `user` ( `id` int(11) NOT NULL AUTO_INCREMENT COMMENT 'ID', `email` varchar(255) NOT NU

原创 JS中关于原型链继承的理解

原型链的关系：constructor：指向构造函数prototype：存放方法和属性_ proto_:类似于指针通过调用构造函数，创建一个实例，每个构造函数都有一个原型对象prototype。实例被构造函数创建，就可以访问到构造函数的原型prototype，进而使用其中的方法和属性。而原型中则有一个constructor属性指向构造函数。关于原型链继承：dog的原型指向Annimal 可以继承到Animal的方法相当于将Animal的 __ proto __指向赋值给Dog的原型.

原创 JavaScript：正则表达式各类字符方法汇总纪律

1、 直接量字符字母和数字字符自身\oNull字符\t制表符字符匹配\n换行符\v垂直制表符\f换页符\r回车符\将特殊字符转义成普通字符2、作用域匹配字符字符作用i：ignoreCase匹配时忽视大小写m：multiline多行匹配g：global全局匹配3、 正则表达式实例方法方法名称功能返回值exec用来匹配字符串中符合正则表达式的字符串返回值

原创 javaScript：9个数组方法的重构

1、toString重写重写将将分隔符作为参数//toString重写Array.prototype.toString= function (a) { var str = ''; for(var i =0 ; i < this.length; i++){ if(i == this.length-1){ str =str + this[i] } else{ str =str + this[i] + a; } } return

原创 JavaScript：函数function与方法method的区别？

函数function与方法method的区别？总结：类（对象）里边的是方法，类（对象）外边的是函数函数（function）可以直接用函数名字调用方法（method）通过对象调用。把函数写在对象里面，就变成了对象的方法。方法是函数的特殊情况。只是函数是全局的，而方法是局部的，是将函数给了当前对象。...

原创 html+css+JavaScript的简单笑话生成器

**在JavaScript MDN上面看到的一个挺简单的小案例注意：尽量不要把js文件放到head里面，会监听不到事件**// html <body> <div> <label for="customname">输入自定义名字：</label> <input id="customname" type="text" placeholder="李雷"> </div> <div

原创 运行vue项目时 浏览器空白报错： Error: Module build failed

运行vue项目时浏览器空白报错：Error: Module build failed (from ./node_modules/[email protected]@svg-sprite-loader/lib/loader.js1、 rm node_modules2、npm cache clear --force3、npm install npm -g4、npm install失败改用 cnpm install5、最后npm runstart然后莫名也成功了。。。。npm

原创 服务器部署jar包，打开swagger接口步骤

拿到后端jar包后1、连接服务器数据库的数据库中如果没有连接数据库先进行连接远程服务器数据库2、对连接的数据库创建用户给予服务器全部权限3、导入sql数据4、在服务器添加项目端口号进行访问5、在服务器运行上传的jar包 nohup java -jar xxxx.jar &使用nohup命令运行jar包，后面加上&符号，表示不挂断运行命令，当账户退出或终端关闭时，程序仍然可以运行$ nohup java -jar xxxx.jar &#查看j

原创 npm版本问题

解决链接：https://stackoverflow.com/questions/68260784/npm-warn-old-lockfile-the-package-lock-json-file-was-created-with-an-old-version

原创 vscode里面运行vue项目遇到的问题

1、下载依赖时： npm install可能出现权限问题首先设置vscode以管理员身份打开也可以直接设置属性这个时候还报错npm ERR! code ERESOLVEnpm ERR!npm ERR! Found: @babel/[email protected] ERR! node_modules/@babel/corenpm ERR! Fix the upstream dependency conflict, or retrynpm ERR! this command with --forc

原创 ubuntu安装和卸载数据库命令及过程

1、安装命令sudo apt-get install mysql-client mysql-server中间需要输入密码必须记住密码！而且尽量还是不要设置root这种普遍密码2、检查是否运行一般下载完成就是在运行sudo service mysql status3、检查是否安装成功sudo netstat -tap | grep mysql4、启动mysql mysql -u root -p 删除mysql1、删除数据库sudo apt-get remove mysql-*

原创 centos安装mysql时遇到的问题

1、查看可以安装哪些项yum list | grep mysql1.1错误：The program ‘yum’ is currently not installed. You can install it by typing:解决：apt install yum1.1.1 错误：Failed to fetch http://mirrors.cloud.aliyuncs.com/ubuntu/pool/main/libx/libxml2/python-libxml2_2.9.3+dfsg1-1ubu

原创 navicat连接数据库：Your password has expired. To log in you must change it using a client that supports ex

cmd命令修改密码：mysqladmin –u root -p password

原创 CSS:动画animations

-过渡和动画之间的异同1.1不同点过渡必须人为的触发才会执行动画动画不需要人为的触发就可以执行动画1.2相同点过渡和动画都是用来给元素添加动画的过渡和动画都是系统新增的一些属性过渡和动画都需要满足三要素才会有动画效果书写格式：@keyframes animiation名字{//可以十form–to 或者0–100%​ keyframes-selector{//属性：变化​ css-style;​

原创 CSS过渡-Transitions

transition: 过渡属性 过渡时长 运动速度 延迟时间;-transition-propertytransition-durationtransition-timing-functiontransition-delay-过渡三要素​ 1.1必须要有属性发生变化​ 1.2必须告诉系统哪个属性需要执行过渡效果​ 1.3必须告诉系统过渡效果持续时长-要有过渡触发1、:hover 鼠标悬停触发2、:active 用户单击元素并按住鼠标时触发3、:focus 获得焦点时触发4、@me

原创 CSS：父子级清除浮动方法

父子级清除浮动添加空白div。对其清除左右浮动：clear：both给父元素设置over-flow：hidden 解决上一种方法的弊端给父元素添加伪类元素：：after.clearfix::after {content:"";display:block;clear:both;}...

原创 CSS：兄弟级浮动

兄弟级浮动当某一个元素浮动时兄弟级元素为块级元素时如果块级元素设置了宽高，则效果与平常没有差别，兄弟块级和浮动元素独占一行如果块级元素没有设置宽高，但是兄弟块级里面有内容撑开，则兄弟块级和浮动元素依然各自独占一行兄弟级元素为行级元素时会出现字围现象浮动元素和行级元素会同在一行...

原创 块级元素和行级元素特点区别整理

行级元素（行盒：inline）常见行内元素：span、a、（img、textarea、button、input）、label、select、canvas、audio、video，b, i, strong、em、br、（img、textarea、button、input）：可设置宽高基本特点：1、不换行（与其他行级元素共享一行）2、由于不用来搭建网页结构，宽高不能改变（自适应宽高）3、img默认是行级元素，但是能修改宽高4、行级元素内不能嵌套块级元素5、水平方向排列面试题：如果行级与行级元素