自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(123)
  • 收藏
  • 关注

原创 el-tree组件踩坑

业务逻辑问题: tree 组件中,同一选项会出现多次,这样使用 id 指定 key 值时会出现交互问题,element 默认 key 值唯一如下解决方法:自己循环所有数据项,创建新的 key 值,例如:语文组-张三 英语组-张三等。再根据 key 值去操作 tree 中的节点是否勾选...

2021-11-24 17:33:08 4

原创 vue 实现基础的拖拽排序

主要使用下面三个事件绑定@dragstart=func(index, e) 开始拖元素触发,作用于拖拽元素, index为拖拽开始的位置@dragover=func(index, e) 当元素拖动到drop元素上时触发,index为拖拽结束的位置@drop=func(index, e) 当元素放下到drop元素触发,index为拖拽结束的位置我主要是使用 @dragstart 以及 @drop 这两个事件// html<li v-for="(item, in

2021-11-10 17:57:15 646

原创 vue-awesome-swiper 中文文档

vue-awesome-swiper 中文文档

2021-09-30 14:32:46 53

原创 vscode eslint格式化配置

https://www.bilibili.com/video/BV1zq4y1p7ga?p=171

2021-09-12 19:31:47 67

原创 vue scoped 以及 /deep/ 原理

使用 vue 写样式时,可以使用 scoped 属性,使组件得样式只在当前组件生效原理: vue 会给每个节点添加一个属性值,并且处理样式时,给每个样式添加一个属性选择器,如下// html<div class="fotter" data-v-001></div>// css .fotter[data-v-001] { /* ... */ }...

2021-08-17 16:20:47 30

原创 vue mixins简述

mixins 是 vue 中用来解决代码夯余的问题主要用来储存公用代码以及方法,( 登录,登出,固定跳转等 )mixins 使用定义 mixin 对象 (这个对象本质上也是一个 vue 实例)调用 vue.mixin 方法混入当前对象// 第一步: 定义全局对象const mixin = { data() { return { //... } }, computed: { // ... }, methods: { //... }}// 第二步: 挂载.

2021-08-11 17:37:42 28

原创 vuex 简述

vuex 解决了组件以及路由之间相互通讯和实时更新的问题1. Statestate 提供统一公告资源,所有公共的变量可以放在 state 中存储// 声明全局变量const store = new Vuex.Store({ state: { count: 0 }})/** * 调用全局变量 * 方法一: this.$store.state 调用 */ this.$store.state.count // this 指向全局 vue 实例/** * 方法二: mapState.

2021-08-03 15:16:00 9

原创 webpack 基础

1. webpack.config.js 基本配置webpack.config.js 都是使用 commentJSconst path = require('path');const { resolve, join } = pathconst HtmlWebpackPlugin = require('html-webpack-plugin')module.exports = { entry: './src/index.js', // 入口文件 /* bulid

2021-05-16 22:20:37 18

原创 elementUI el-select 不支持bulr表单验证 解决方法

思路: 自定义组件事件 bulr, 手动触发表单验证el-select 组件中定义 bulr 事件 @blur.native.capture='onclick'定义表单 rules 规则手动触发对应表单规则校验 this.$refs[formName].validateField(type) formName:表单名称 type:表单属性// html// 页面中我定义了多个表单,所以传入了表单 ref 名称。单个表单可以只传属性值<el-select @blu.

2021-04-30 17:13:05 180 1

原创 chrome 浏览器解决跨域

右击浏览器图标点击属性目标后面增加一行文本-ignore-certificate-errors --disable-web-security --user-data-dir=C:\MyChromeDevUserData在浏览器桌面图标中重新打开浏览器

2021-04-25 09:07:06 41

原创 git 以及 vscode 快速下载

https://npm.taobao.org/mirrors/git-for-windows/v2.31.0-rc1.windows.1/

2021-03-07 12:39:28 74

原创 CSS 新属性 《设置容器长宽比》

Chrome 88 浏览器支持新的 CSS 属性aspect-ratio,可以设置容器的长宽比。

2021-02-18 14:52:20 85

原创 h5 唤起 app(ios,and),没下载则跳转下载链接

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head> <meta charset="utf-8"> <title>唤醒app</title> <div id="btn" style="font-size: 2.

2021-02-05 11:31:02 346

原创 去除overflow:scroll 滚动条

css3有一个直接调用的css,保证隐藏滚动条的同时还可以继续通过滚轮向下翻::-webkit-scrollbar { /*隐藏滚轮*/ display: none;}但是仅限于支持css3的浏览器。

2021-01-12 11:35:58 894

原创 h5 ios 样式错乱

1. 问题app 内嵌 h5 IOS 中显示错误, 如下2. 解决后来发现 ios 对 flex 或者 gird 布局不友好,换成 float 完美解决

2021-01-05 09:16:33 363

原创 聚合二维码生成(小程序二维码、付款码)

微信公众平台 》 开发 》 开发设置 》 启用 ‘扫普通链接二维码打开小程序’ 》配置普通链接二维码规则

2020-11-04 16:14:10 1363 1

原创 小程序动态改变 image src 失效

需求: 上传图片到服务器后改变 image src ,将图片显示出来,问题: 重复提交时,返回的图片路径都是一模一样的,这时服务器上的图片已经改变,但是不会更新视图中的图片.解决: 在图片路径最后添加参数, 为随机数,这时视图就会响应更新, 如下'http//:×××××.png?a=×××××' // 每一次参数都不一样...

2020-10-30 09:49:08 1612

原创 前端获取用户 IP 地址

// 请求 soho 接口, 返回值如下: // var returnCitySN = {"cip": "120.228.1.183", "cid": "CN", "cname": "CHINA"}; <script src="http://pv.sohu.com/cityjson?ie=utf-8"></script> <script> // session储存 IP 地址,需要的时候再用 sessionStorage.setItem("userIp.

2020-10-15 17:43:18 555

原创 响应式组件库

可适配移动端,纯 JS 原生编写

2020-08-26 21:35:32 110

原创 小程序 scroll-view 出现滚动卡顿解决

目前问题只会在真机上出现,开发工具中无法复现网上有多种方式都列举出来,以便以后查阅scroll-view 内容太多,并且设置了 absolute ,将层级设高即可解决,原理不明。(反正我是这么解决的)将 JSON 文件中的 "enablePullDownRefresh":"true", 删除设置 scroll-view 的高度选择不同的基础库调试给 view 和 scrll-view 设置 -webkit-overflow-scrolling: touch...

2020-08-15 12:43:50 1696

原创 Typescript 简述

1. 概述Typescript 是 js 的超集(相当于 js 的扩展,并且这个扩展包含 js 的任何功能)ts 新增了 类型系统,代码更加易于维护,使用其开发大型项目更加友好Vue3 源码大部分使用 TS 重写,未来的趋势优势:类型化:开发类型化,有效避免了很多因语言本身的灵活所导致的 Bug 的出现提高代码可读增强了 API ,枚举等补充 API2.使用2.1. 原理TS => 解析 => JS => 浏览器执行 / node环境运行2.2. 安装npm

2020-08-11 20:41:17 138

原创 图片在线转 64base编码

小程序 background-image:url();不可以使用相对/绝对路径,需要转为 64base 编码在线转 64 base 编码

2020-07-30 14:35:44 209

原创 小程序 蓝牙打印

最近着手开发了一个小程序的 B2B 后台管理以及业务处理系统其中用到了蓝牙小票打印功能,踩了很多坑,特此记录一下1. 官方 API 梳理梳理一遍后,小票机应该是属于低功耗蓝牙连接,官方也有写入数据的 API大体思路:初始化蓝牙模块 wx.openBluetoothAdapter()搜寻附近的蓝牙外围设备 wx.startBluetoothDevicesDiscovery()监听寻找到新设备的事件 wx.onBluetoothDeviceFound()连接低功耗蓝牙设备 wx.crea.

2020-07-11 23:35:03 622 2

原创 taro 踩坑笔记

最近使用 react 的多端开发框架 taro 时踩了很多坑,记录一下1. 只使用 class 选择器, 使用伪类时在小程序端无法生效2. 使用 CSS 实现 多行文本溢出显示省略号 时,发现 外部样式表中的某些样式会被忽略掉,导致一直无法生效解决方法 :直接添加行内样式即可3. 使用图片时,不可以直接使用,必须将图片 import 入 文件后才可以使用。import phoneIcon from '../../../public/images/phone.png'4. 组件中定义 add.

2020-06-20 20:29:20 242

原创 forEach 和 map

二者都是用来遍历数组的每一项,二者都不会通过处理遍历项 直接改变原数组1. forEach没有返回值,三个参数(数组项,下标,索引数组)可以通过改变 索引数组 或者 原数组 来更改数组,索引数组就是原数组的地址,可以通过改变它去改变原数组var arr = [1,2,3,4,5]arr.forEach((item, index, tempArr) => { tempArr[index] = item*10 // 等同于 arr[index] = item*10})console.l.

2020-06-20 20:02:01 70

原创 抢鲜!Vue 3.0

尤雨溪大佬在 2020年 4月 17日 凌晨 4点 推出了 Vue 3.0 Beta 版。之前也有关注尤大的发布会,这个消息也是才知道,下面来体验一下。github 上的地址:https://github.com/vuejs/vue-nextgithub 上找项目就不贴出来了,直接克隆 demo 项目克隆项目:https://github.com/vuejs/vue-next-web...

2020-04-24 09:51:23 78

原创 后台管理系统 demo 效果

1.登录页面2.权限管理3.商品管理4.订单 以及 数据

2020-04-23 16:32:29 1935 1

原创 ES6 find / findIndex 底层详解

1.作用ES6 提供了 find 以及 findIndex 方法,可以让我们在数据中根据条件找出需要的项。二者原理相同,都接受一个回调函数。只是一个返回 符合条件的数据,一个返回符合条件的数据下标// find var a = [ { id: 1, name:'张三' }, { id: 2, name:'王五' }] var data = a.find(funct...

2020-04-21 16:35:07 296 1

转载 JavaScript 基础进阶(转载)

看了一个博主的前端基础进阶系列文章,对自己帮助很大。转载链接如下https://segmentfault.com/a/1190000012646488

2020-04-20 10:21:53 89

原创 MySQL JSON类型及存储引擎

MYSQL8 新增了JSON 类型。在某些时候,对于网页中不需要经常改动的数据,一般以数组形式的字符串存入库中。这样不易更改 数据。使用 JSON 类型可以很好的解决这个问题1.JSON类型创建方式:CREATE TABLE 表名...json字段名称 JSON...)下面创建一个字段为 JSON 类型2.基本方法使用 JSON_ARRAY() 和 JSON_OBJECT...

2020-04-15 21:23:35 250

原创 MySql 函数以及储存过程

1.MySql 字符函数mysql 为用户提供了一些函数来处理数据操作

2020-04-12 10:25:22 73

原创 mysql 无法登录解决方法

1.无法连接至本地服务器Can't connect to MySQL server on 'localhost' (10061)博主在本地安装了两个 MySQL,可能是两个运行导致冲突解决方法:重新安装 mysqld 服务,输入 mysqld --remove mysql,成功后再安装,输入 mysqld --install重启 mysql, 输入net stop mysql。成功后再...

2020-04-11 12:25:24 652

原创 Vue-cli3 项目优化
原力计划

Vue 项目完成后,因导入了大量的或体积较大的依赖包以及插件,导致项目变得非常臃肿。下面通过几个方面来优化页面的用户体验以及提升页面的响应速度。1. nprogress 页面进度条效果1.1.使用效果在项目中安装使用 nprogress 依赖项,使用户获得更好的用户体验。使用后会在页面载入时出现页面顶部的进度条。效果如下:1.2.安装使用方法( vue ui 面板 )先在项目中下...

2020-04-10 16:27:36 174

原创 Cookies 和 Session 以及 webStorage 的作用与区别

Cookeis 和 Session 利用了浏览器的缓存机制,都可以用来保存用户的数据,得以和服务器进行交互。又因为 http 是无状态的,可以使用 Cookeis 和 Session 来保存用户的状态。1.Cookeis(保存在浏览器端)Cookies 是服务器向客户端发来的信息,以文本方式进行储存,每一次请求时携带 CookeisCookies 机制 分为两种情况:1.未设置过期时间...

2020-04-03 19:40:32 107

原创 MySQL数据操作

1.插入数据 insert向表中插入数据有三种方法INSERT [ INTO ] 表名(字段名 , .....) VALUES(数据 , .....) 此方法可插入多条数据,但不可使用子查询。INSERT [ INTO ] 表名 SET 字段名 = 数据 || DEFAULT 此方法只能逐条添加数据,可以使用子查询。INSERT [ INTO ] 表名 字段名 , ..... SELE...

2020-03-24 21:28:57 48

原创 MySQL 字段操作

1.修改数据表1.1.添加单列ALTER TABLE 表名 ADD 列名 字段约束 [ FIRST | AFTER 列名 ]操作如下,我们在 名为 child 的表中 添加了 price 字段并添加字段约束 ,并且 最后 FIRST 指令表示在表第一列添加,默认为在表尾添加1.2.添加多列ALTER TABLE 表名 ADD(列名 字段约束 , ....... )添加多列时,不支持...

2020-03-21 12:06:44 48

原创 MySQL 字段约束

1.MYSQL 字段约束有时设置字段的数据类型还远远不够,还需要添加一些附加属性,如自动增量、自动补零、默认值设置等。这时可以使用字段约束来实现。1.1. UNSIGNED只能用于设置数值类型。不允许出现负数,若是某些字段不需要插入负数,使用该属性可以将字段的最大储存长度增加一倍。例如:(TINYINT:原本储存长度为 -128 ~ 127,使用UNSIGNED后为 0 ~ 255)...

2020-03-19 21:56:01 212

原创 mysql基础

1.MySQL安装这里使用了 windows mysql8 免安装版,只需要更改配置即可安装进入网址下载 https://www.lmonkey.com/tools/java在网址中找到上面所示的下载包,点击下载2.MySQL配置解压文件夹之后可找到 readme.txt 文件,里面有需要配置的详细信息,如下将文件解压入到自定义的目录 下配置my.ini (配置信息在...

2020-03-15 16:54:33 117

原创 axios简述

先看看一个 axios 基本语法实例axios.get('/adata').then((res) => { console.log(res.data) //data为获取的数据})由上述代码,我们结合 axios.请求方式('请求路径').then((res) => { console.log(res.data) }) 此语法,可以很好地了解到 axios 改如何发送请求并拿...

2020-03-13 15:44:47 202

原创 exports defalut 和 export

ES6 导出导入导入: import 模块名 from '模块标识符' 和 import '路径'导出: export defalut 和 export 向外暴露成员NODE 导出导入导入: var 名称 = require(‘模块标识符’)导出: module.exports 和 exports注意:语法要成套使用,不要导出用 node ,导入用 ES6 语法...

2020-03-06 16:44:49 65

空空如也

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人 TA的粉丝

提示
确定要删除当前文章?
取消 删除