小鱼干儿er-优快云博客

原创 vue3+vite按需引入vxe-table

【代码】vue3+vite按需引入vxe-table。

2023-10-30 13:45:10 2610

js 的 split 方法 js里的 split() 方法大家都知道用于将字符串转化为字符串数组，里面可以放两个参数，第一个参数必选，可以是字符串或正则表达式，代表从该参数指定的地方分割，第二个参数可选，代表返回子串的个数不多于该个数，如果没写第二个参数则代表全部分割。然而今天刷LeetCode的时候，发现了一个有趣的地方，就是当要分割的那个参数位于字符串的头或尾或在字符串中出现相邻的情况时，会补上一个空的字符串，描述起来有些绕口，不如举个????：以 ‘a’ 为指定位置分割字符串 ‘asdaasda

2021-08-19 15:18:25 3804 1

原创 webpack学习（一、入口与出口）

webpack学习（一、入口与出口）安装打包编写webpack配置文件html-webpack-plugin插件publicPath安装使用 webpack ，第一步先安装：初始化项目npm init -y（-y 是指一路选择 ‘yes’ ，即选择默认项）安装webpack、webpack-clinpm install webpack webpack-cli（如果安装过淘宝镜像，可以使用cnpm更快）打包进入到项目的文件夹，命令：npx webpack就可以生成dist文件夹编

2021-08-18 17:31:02 452

转载 MarkDown使用说明（自用）

这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入欢迎使用Markdown编辑器你好！这是你第一次使用 Markdown编辑器所展示的欢迎页。如果你想学习如何使用Mar

2021-08-18 16:30:26 723

原创 JSON 和 JS 对象的区别

JSON 和 JS 对象的区别前言JSONJS 对象JSON 与 JS 对象的转换应用场景前言以前总弄混 JSON 和 JS 对象，以为差不多是一个东西，但事实上是不一样的。JSONJSON 是序列化的对象或数组，它是 JS 对象的字符串表示方法，也就是说，JSON本质上是一个字符串。JSON以键值对 (key, value) 的形式存在，其中：JSON的 key 必须用 "" (双引号)包起来JSON的 value 不可以为 function/undifined/NaN数据结尾不允许出现无

2021-08-04 13:36:00 2200

原创 echarts 对应位置做成堆叠图

echarts 对应位置做成堆叠图前言解决方法效果图前言我有四根bar显示在同一横坐标上，其中两根永远是正值，也就是在y轴的正轴上，两根bar是负值，在y轴的负轴上，我想让这四根bar在一个单位上占两个位置，让bar1和bar3相对应显示，bar2和bar4对应显示。解决方法echarts里面有一种图叫做 stack(堆叠图) ，将四根bar改成：series: [ {name: 'winUpper', type: 'bar', stack: 'stackUpper'},

2021-07-29 14:46:45 599

原创【已解决】echarts有残留的连线

echarts有残留的连线前言解决方法解释前言今天做好了一个图，每次查询显示对应数据的echarts图，发现了bug，当我第一次查询时应该有5条线，第二次查询时应该有4条线，但第二次显示在页面中的却有5条线，应当不存在的那条线是第一次查询时残留下来的。解决方法在每一次绘制前我的数据都有先置空再填充，但依旧会残留一条线，后来发现，在设置option的时候加上true即可解决：this.myChart.setOption(this.option, true)解释先看一下echarts的官方文档中的

2021-07-21 15:17:57 3444 11

原创 vue实现可拖拽的div

可拖拽的div今天发现右下角的一组按钮很挡视线，但是它还就应该放到右下角，所以在想，让它可以拖拽，在挡视线的时候拖走就好了。这个功能不一定非要vue实现嘿嘿，其实就是这个逻辑，html + css + js 也可以这样做的~首先先写好你的那一块东西，调好样式哈，我的是一组按钮：<div class="arrow-container" @mousedown=arrowMove> <Button type="primary" shape="circle" icon="ios-arr

2021-07-16 15:24:56 3775 4

原创 iView的表格做一个带斜线的表头

iView的表格做一个带斜线的表头效果实现效果效果如图：（最上面一层还有一个一级表头，图示单元格为二级表头）实现利用render函数，将单元格上下两部分内容写到一个单元格里，并使其位置错开，可以按照美感自己手动调：children: [{ title: '', key: '品种', align: 'center', width: 150, renderHeader: (h, params) => { return h('div', { style: {

2021-07-08 11:11:36 919

原创把echarts的饼图放在table的每一个单元格中

把echarts的饼图放在table的每一个单元格中前言想法实现最后前言最近接到了一个新的任务，要求把echarts的饼图放在table的每一个单元格中，饼图显示当前策略盈亏所占比例。想法刚开始我就在想或许用render函数很好写出来，将饼图封装在一个组件中，在render函数里使用该组件。但我的table里的每一项都是从后端传来的，包括表头也是不固定的，会根据想要搜索的日期，生成长度不同的各项。尝试用render函数：this.symbols[item].render = () => &

2021-07-07 10:52:44 1666 2

原创【已解决】‘_isHover‘ of undefined

在使用iview做table表格时，报错：'_isHover' of undefined在一个vue项目中，填充表格时，需要从后端获取的各项来填充，所以将获取的内容放入数组中，虽然成功显示表格但报了很多错，表现为每当触发表格每一行的hover时报一个错误：后来将数组在for循环中直接赋值，改为用 push() 方法，更加合理，也解决了错误修改前：修改后：...

2021-06-30 13:52:18 826

原创 Vue生命周期中对mounted、beforeUpdate、updated的理解

Vue生命周期中对mounted、beforeUpdate、updated的理解前言mounted、beforeUpdate、updated前言以下文章纯为个人理解，如有错误，请求评论区指正呀！（如果想直接看正文内容可以直接跳过这一部分）Vue生命周期的八个钩子函数想必大家都不陌生，但我一直都只是做简单了解，知道大概的意思，Vue官方文档里的图也看过很多遍，但一直不太理解，从前我在写项目中时如果需要用到生命周期函数，大多写在created和mounted中，也没怎么出过问题，直到我的上一篇文章中分享

2021-06-17 15:04:05 3732 1

原创 Vue 全局监听键盘事件（在项目中使用键盘左右键控制翻页）

Vue 全局监听键盘事件（在项目中使用左右键控制翻页）想法实现方法想法此段可略过，直接看后面如何实现的页面结构：有一个含有表格的父组件，表格利用iView里的 <i-table> 和 render 函数实现的，表格中含有一个显示按钮，点击后会出现一个 <Drawer> 的抽屉，其中，这个抽屉由于在项目中多次用到，被我封装成了一个 <charts> 组件，抽屉中左侧为详细信息的数据，右侧是用 echarts实现的折线图等。点击父组件的按钮，出现抽屉，显示对应那一条数

2021-06-16 15:59:37 3024

原创【已解决】vue项目地址栏的图标不显示

地址栏的图标不显示解决方法：解决方法：图片的格式生成为.ico,利用Windows自带的画图，16*16的大小，选择另存为bmp文件，把后缀改成.ico 依然不显示。在vue的项目中，图标一类的静态文件应该放在static文件夹中，不能放在src 中，网页把根域名作为相对路径的根目录了，然而我们文件的路径是相对于项目文件的根目录的，因此就找不到了。而static文件夹下的文件（夹）会按照原本的结构放在网站根目录下。这时我们再去使用/static绝对路径，这样就可以访问这些静态文件了。成功解决不显示

2021-06-11 16:44:45 2068

原创【已解决】eslint只在控制台报错，不在代码中显示红色错误信息了

【已解决】eslint只在控制台报错，不在代码中显示红色错误信息了修改方法今天一打开我的vscode不知道点了什么还是自己变的，当我的语法格式不符合eslint时，只在控制台报错，不在代码段中显示红色波浪线的错误信息了。从前如果显示红色波浪线错误信息，大多数的错误是可以点击它的自动修复的，但是自从错误只在控制台报错，就只能自己先找到错误的地方，然后手动修改，很麻烦。。。修改方法在命令面板中搜索 settings.json(命令面板打开方法：Ctrl+Shift+P)打开vscode的设置文件，

2021-06-11 16:15:10 7828 5

原创 vue父子组件传值之 $emit和props

vue父子组件传值之 $emit和props前言子组件向父组件传值父组件向子组件传值前言在进行vue的项目中，我们难免会需要父子组件之间进行传值，父子组件传值可以通过 $emit和props , eventbus, vuex等，本文主要介绍第一种方法。子组件向父组件传值子组件向父组件传值利用的是 $emit假设我们的父组件为：<app></app>里面嵌套了子组件：<app> <child></child></app&g

2021-06-04 14:10:13 10559 5

原创 npm 一些常用命令的缩写

npm 一些常用命令的缩写1. install = i如：npm install = npm i2. --save = S如：npm --save= npm S3. --save-dev = -D如：npm --save-dev = npm -D4. --save-prod = -P如：npm --save-prod = npm -P5. --global = -g如：npm install --global = npm i -g...

2021-05-31 15:44:09 1052

原创 npm install --save-dev

npm install --save-devnpm install --save-dev 是指将依赖安装至生产环境。在项目的 package.json 文件中，“dependencies”: {} 中是在开发环境中所需要的依赖，后面代表了它们的版本号"devDependencies":{} 中是在生产环境中所需要的依赖，后面代表了他们的版本号npm install --save-dev 与 npm install --save 的区别输入命令行 npm install --save-dev

2021-05-31 15:29:42 3640

原创 webpack

webpack打包工具前言安装概念入口-entry输出-output前言查看官方文档webpack是一个模块化打包工具，当它处理应用程序时，会在内部构建一个依赖图，这个依赖图会映射到项目所需的每个模块，并生成一个或多个bundle。依赖图：一个文件依赖于另一个文件，在webpack中被视为依赖关系，这使得webpack可以将非代码资源作为依赖提供给应用程序，webpack递归地构建一个依赖图，这个依赖图包含应用所需的每个模块，然后将这些模块打包成少量的bundle（通常只有一个，可由浏览器加

2021-05-31 14:15:38 143

转载 HTTP工作原理

HTTP工作原理前言HTTP协议工作原理HTTP请求/响应的步骤一个例子前言学习来自这位大佬的文章HTTP协议工作原理HTTP协议定义了web客户端如何从web服务请求web页面，以及服务器如何把web页面发送给客户端。客户端向服务器发送一个请求报文，包括请求的方法、URL、协议版本、请求头部和请求数据、。服务器以一个状态行作为响应，响应的内容包括协议的版本、成功或错误代码、服务器信息、响应头部、和响应的数据。HTTP请求/响应的步骤1. 客户端连接到服务器一个HTTP客户端，通常是

2021-05-27 11:22:48 239

原创 5.17开始的一个项目

遇到的一些问题及解决办法vue-element-ui菜单左侧无法延长至屏幕最下面获取后端apielement-ui 里el-dialog遮罩层遮住dialog：为el-dialog添加：modal-append-to-body=false后解决element-ui 里el-dialog遮罩层遮不住一些元素：登录的button不能设置position：fixed；fixed的z-index高于所有checkbox默认勾选在搜索后勾选消失：把true和false转换成0和1的if语句里面不能使用本身

2021-05-26 14:03:22 252

原创 Vue.js起步

Vue.js前言Vue 实例el:data:method:前言Vue 官网指路Vue 是一种渐进式JavaScript框架，Vue.js 的核心是一个允许采用简洁的模板语法来声明式地将数据渲染进 DOM 的系统。我们在前期练习Vue时可创建一个 .html 文件，在文件中引入 Vue.js 的文件。Vue.js文件在这里哦，大家可以自行下载到本地后引入到自己的代码中。Vue 实例<body> <div id="app"> {{message}}

2021-05-01 20:15:40 150

原创前端基础（三十七、ES6 rest）

三十七、ES6 restargumentsrest的作用rest的使用注意argumentsarguments 是一个对应于传递给函数的参数的类数组对象。在前面的文章中我们介绍过类数组：类似数组但并非数组。举个栗子： function fn(a,b,c){ console.log(arguments[0]); // 输出: 1 console.log(arguments[1]); // 输出: 2 console.

2021-04-25 13:09:04 427

原创前端基础（三十六、ES6 扩展运算符）

三十六、ES6 扩展运算符前言扩展运算符的作用1. 合并数组2. 数组复制3. 把类数组转为数组前言在前面的文章中我们已经使用过扩展运算符：... ，接下来文章将详细介绍扩展运算符的使用。扩展运算符的作用合并数组数组复制把类数组转为数组1. 合并数组 // 1.合并数组 let arr1 = [1,2,3]; let arr2 = [4,5,6]; console.log(...arr1,...arr2);// 输出： 1 2

2021-04-17 12:53:03 812

原创 React-搭建脚手架

React-搭建脚手架create-react-app官方中文文档在这里哦！安装nodenode -v保证node的版本在6以上，npm 5.2+ 或更高版本安装react脚手架(sudo) cnpm install -g create-react-app创建React项目create-react-app react-appcd react-app 打开项目文件夹npm start 启动项目更于2021/3/28...

2021-03-28 10:07:20 120

原创 Git -上传分支

Git -上传分支git branch 查看分支git branch feature-users_examine-yn 创建本地分支git checkout feature-users_examine-yn 切换分支git status 查看更改的代码git add . 暂存全部已修改代码至本地git restore --staged src/views/users/examine/index.vue 撤销暂存的文件git commit -m ‘用户审核’ 对文件注释git push -u

2021-03-27 13:41:05 192

原创前端基础（三十五、ES6 解构赋值）

三十四、ES6 解构赋值前言解构赋值对数组的解构对对象的解构前言解构赋值是对赋值运算符的扩展，针对数组或对象进行赋值匹配，方便了对复杂数据字段的获取，且简洁易读，使语义清晰明了。解构赋值对数组的解构基本情况 let [a, b, c] = [1, 2, 3]; console.log(a,b,c); // 1 2 3 let arr = [1,2,3]; let [a,b,c,d = 10] = arr; co

2021-03-24 10:46:31 202 1

原创前端基础（三十四、ES6 let与const）

三十四、ES6 let与const前言let与constletconst临（暂）时性死区前言接下来的文章中我们将学习ES6：ECMAScript 6.0（ ES6）是 JavaScript 语言的下一代标准。 ES6 主要是为了解决 ES5 的先天不足，比如 JavaScript 里并没有类的概念，但是目前浏览器的 JavaScript 是 ES5 版本，大多数高版本的浏览器也支持 ES6，不过只实现了 ES6 的部分特性和功能。ECMAScript 和 JavaScript 的关系是，前者是后者的

2021-03-22 23:04:09 204

CSS3过渡.mp4

空空如也