- 博客(130)
- 资源 (2)
- 收藏
- 关注
原创 Node中使用mysql连接器连接mysql8失败的原因及解决
mysql从8.04引入一个caching_sha2_password模块作为默认身份验证插件,数据库连接时验证身份的工作方式(handshake process)会与以往不同
2022-09-23 22:33:03 1568 1
原创 基于 vue2.x 切割面板组件
Split-Pane component built with vue2.0, can be split vertically or horizontally.
2022-06-14 16:02:16 901
原创 vue-puzzle-vcode与vue-drag-verify纯前端的拼图人机验证、右滑拼图验证
vue-puzzle-vcode与vue-drag-verify纯前端的拼图人机验证、右滑拼图验证
2022-03-27 22:43:33 5138 5
原创 将url参数转成对象
param2Obj(url) { const search = decodeURIComponent(url.split("?")[1]).replace(/\+/g, " "); if (!search) { return {}; } const obj = {}; const searchArr = search.split("&"); searchArr.forEach((v) => { const index = v.indexOf("=");.
2022-03-08 15:06:09 896
原创 vue安装sass-loader运行报错解决方法
在搭建vue项目过程中,想要在项目中使用sass,需要安装sass-loader,但是很多人在安装过程中会遇到很多报错。如果初次安装sass-loader依赖后就报错,那很大概率应该是由于版本问题导致。不加版本号的安装默认通常是安装的最新版本。npm install node-sass --save-dev //安装node-sass npm install sass-loader --save-dev //安装sass-loader 如果已经安装过sass-loader和node-sas
2022-02-11 17:20:12 2911
原创 轻松五步快速上手ECharts
步骤1:引入echarts.js文件 步骤2:准备一个呈现图表的盒子 步骤3:初始化echarts实例对象 步骤4:准备配置项 步骤5:将配置项设置给echarts实例对象前期准备准备echarts所需的js,可从这里下载提取码rvk9步骤1:引入echarts.js文件<script src="../js/echarts.min.js"></script>步骤2:准备一个呈现图表的盒子<div id="myEcharts" style="w..
2022-02-09 15:20:00 536 1
原创 主题时钟(theme clock)
描述:显示当前时间,可以主题切换、中英文切换重点:1、定位2、css变量3、主题切换,中英文切换4、使用工具函数scale实现代码:index.html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="vi.
2022-02-08 17:18:55 633
原创 键盘键码(Event Keycodes)
描述:当按下键盘上的任意按键时,显示当前按键的key、keyCode、Code等信息重点:1、css渐变2、字符串模板3、键盘事件监听实现代码:index.html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta nam.
2022-02-08 17:11:06 481
原创 隐藏搜索小部件(hidden search widget)
描述:点击放大镜可以展开收起搜索框重点:1、css操作宽度2、类名操作实现代码:index.html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=devi..
2022-02-08 17:02:43 456
原创 步骤条(Progress Steps)
重点:1、使用flex布局2、使用伪元素3、计算进度条宽度,进行类名操作实现代码:index.html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=devic.
2022-01-28 11:26:17 1948
原创 扩展卡(Expanding Cards)
重点:1、使用flex布局2、使用[].filter.call方法实现代码:index.html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-wi.
2022-01-28 11:19:56 446
原创 js获取当前窗口最大z-index
有时候项目需要通过获取最大z-index,并且追加z-index来保证元素在最高层,可以通过以下方式获取当前窗口最大z-index。getMaxZIndex() { var eles = document.querySelectorAll("*"); var maxZindex; for (var i = 0, maxZindex = 0; i < eles.length; i++) { maxZindex = Math.max(maxZindex, eles[i].style.
2021-12-16 16:32:11 1594
原创 为什么使用Object.prototype.toString.call(obj)检测对象类型?
为什么使用Object.prototype.toString.call(obj)比typeof检测对象类型更准确?
2021-12-15 17:16:09 1099
原创 js拖拽库——Sortable.js
Sortable.js是一款优秀的js拖拽库,支持ie9及以上版本ie浏览器和现代浏览器,也可以运行在移动触摸设备中。不依赖jQuery。支持 Meteor、AngularJS、React、Vue、Knockout框架和任何CSS库,如Bootstrap、Element UI。你可以用来拖拽div、table等元素。
2021-12-13 16:25:22 3067 1
原创 vue制作一个最基本的待选、已选demo
<template> <div class="box"> <div> <p>待选:</p> <span v-for="(item, index) in array" :key="index" :class="[{ active: item.isCheck }]" @click="addTag(index)" >{{ it.
2021-11-23 11:29:52 679
原创 element-ui之MessageBox内容换行
使用element-ui的MessageBox弹框时,弹框内容实现自定义换行.let data = ["数据项一", "数据项二", "数据项三", "数据项四", "数据项五"]; let newData = []; const h = this.$createElement; data.forEach((item) => { newData.push(h("p", null, item)); }); this.$con
2021-05-22 00:05:15 1441
原创 element-ui 弹框this.$confirm报错Uncaught (in promise) cancel
在使用element-ui的this.$confirm时,点击取消Cancel按钮或者关闭按钮时,控制台报错,但程序正常运行。控制台报错如下:报错时的代码:this.$confirm("您确定删除选中的记录信息吗?", "提示", { confirmButtonText: "确定", cancelButtonText: "取消", type: "warning", })
2021-05-21 17:17:19 1748
原创 element UI表格之表头换行
render-header: 列标题 Label 区域渲染使用的 Function<template> <el-table :data="dataList"> <el-table-column prop="openRule" :label="设置|setting" :render-header="renderheader"> </el-table-column
2021-04-21 16:47:48 1788
原创 Vue.js学习笔记(三)——计算属性和侦听器
模板内的表达式非常便利,但是设计它们的初衷是用于简单运算的。在模板中放入太多的逻辑会让模板过重且难以维护。例如需要实现反转字符串(比如输入123,输出的是321),使用“Mustache”语法 (双大括号) ,是可以实现,但是不利于维护。<div id="example"> {{ message.split('').reverse().join('') }}</div><!DOCTYPE html><html lang="en"><hea
2020-11-01 23:41:40 218
原创 Vue.js学习笔记(二)——指令
什么是指令?指令 (Directives) 是带有 v- 前缀的特殊 attribute。指令 attribute 的值预期是单个 JavaScript 表达式 (v-for 是例外情况)。指令的职责是,当表达式的值改变时,将其产生的连带影响,响应式地作用于 DOM。Vue.js给我们提供的指令有很多,例如 v-model 、v-for 、v-on 、v-bind等v-model它负责监听用户的输入事件,从而更新数据。<!DOCTYPE html><html lang="e
2020-11-01 20:54:30 182
原创 Vue.js学习笔记(一)——起步
Vue.js是什么?Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合。另一方面,当与现代化的工具链以及各种支持类库结合使用时,Vue 也完全能够为复杂的单页应用提供驱动。Vue.js引入方式直接用<script>引入CDN<script src="https://cdn.jsdelivr.net/npm/
2020-11-01 15:13:16 776
原创 JavaScript学习笔记(四十七)——Node.js操作MySQL
// 引入模块var express = require(“express”);var mysql = require(“mysql”);// 快速搭建服务器var app = express();// 绑定端口app.listen(3000, “127.0.0.1”, () => {console.log(“服务器已开启3000端口…”);})// 创建连接var db = mysql.createConnection({host: “localhost”,user: “ro
2020-10-26 19:10:08 93
vue-element-admin完整依赖包node_modules
2022-03-05
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人