自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

余白x的博客

记录着

  • 博客(63)
  • 收藏
  • 关注

原创 js 树结构数据过滤 保留原始数据结构

js 树结构数据过滤 保留原始数据结构

2024-06-05 11:28:21 203

原创 vue3+Pinia的使用 - 封装

监听piain中的数据更新:数据变化就会触发。persist.ts 可存储到本地。存储数据:general.ts。

2024-03-27 16:18:04 430

原创 el-table分页时多选数据的保存和回显

2、分页获取新数据之后匹配当前页应该选中的数据,使用 multipleTableRef.value!把所有选择的数据全部存到一个大数组中,切页的时候匹配原数据利用ref节点的.toggleRowSelection方法进行回显。1、勾选和全选时需要判断是选中还是取消,然后更新大数组数据。所有代码:(示例为前端分页)

2023-12-04 14:35:18 2362

原创 el-pagination 纯前端分页

实现思路:先把数据存储到一个大数组中,然后调用方法进行切割。主要使用数组的slice方法。需求:后端把所有数据都返给前端,前端进行分页渲染。

2023-12-04 12:12:36 852

原创 vue超好用的自定义指令封装

vue自定义指令 自定义防抖指令 自定义节流指令 自定义复制指令 自定义长按指令 自定义拖拽指令 自定义水印指令 自定义旋转指令

2023-11-22 12:05:36 633

原创 js获取当前时间和一个月前的时间

用当前时间.setMonth(currentDate.getMonth() - 1)获取一个月前的时间。

2023-09-26 10:38:53 1129

原创 vue拖拽插件 - Sortable

vue拖拽插件 - Sortable import Sortable from "sortablejs";

2023-09-15 11:24:23 502

原创 vue插槽slot

vue插槽slot1.普通插槽2.具名插槽3.作用域插槽

2023-09-07 17:46:51 464

原创 用正则表达式进行input框的限制输入

vue项目可以用@input事件输入。

2023-07-03 11:25:36 2162

原创 map和filter事件循环方法

map filter 过滤 遍历

2023-06-26 15:21:10 180

转载 解决跨域的方法

跨域的常见的五种解决方案如下1、jsonp,代表:jquery的$.ajax。(仅限JQuery项目使用)2、script标签解决跨域(远古web使用的方案,已不建议使用)3、前端代理4、nginx代理5、设置响应头(不建议使用,安全性不高,小练习可以用用,方便)

2023-04-20 15:41:07 84 1

原创 前端常用 #

数组常用方法:

2023-03-20 17:48:53 64

原创 PC端 微信登陆 + qq登录

微信登陆https://open.weixin.qq.com + qq登录QC.Login.showPopup

2023-01-10 16:24:18 1190

原创 微信小程序 - 方法

转义字符的处理、返回传参、button标签的open-type、web-view

2022-09-06 15:38:33 893

原创 小程序上传图片的方法 wx.chooseImage({})+ wx.uploadFile({})

wx.chooseImage({ count: 1, sizeType: ['original', 'compressed'], // original 原图 compressed 压缩图 sourceType: ['album', 'camera'], // album 从相册选图 camera 使用相机 success: (res) => { }wx.uploadFile({})

2022-09-02 11:32:13 989

原创 小程序带参数返回上一级 wx.navigateBack()返回传参

getCurrentPages();//直接调用上一个页面对象的setData()方法,把数据存到上一个页面中去,然后再返回

2022-09-01 11:04:33 715

转载 Vue 上传图片裁剪

裁剪使用的是vue-cropper。

2022-08-18 09:58:52 369

原创 微信小程序保存图片的方法

下载(wx.downloadFile) + 保存(wx.saveImageToPhotosAlbum) +授权(wx.openSetting)

2022-06-23 15:26:37 3965 1

原创 切换npm的淘宝镜像

切换npm淘宝镜像npm config set registry https://registry.npm.taobao.org

2022-06-08 16:10:00 270

原创 css溢出显示省略号

单行溢出显示省略号: 多行溢出显示省略号:

2022-06-01 10:04:19 7442

原创 js下载文件的方法(H5、PC)(小程序)

一、H5,PC当后端返回的资源是链接时,此时可以使用 a 标签或者 window.location.href直接打开。1、a 标签形式在H5中,a标签新增了download 属性,包含该属性的链接被点击时,浏览器会以下载文件方式下载 href 属性上的链接。<a href="https://example.com" download="example.html">下载</a> // 或者封装function download(href, title) {

2022-05-11 10:36:13 7862

原创 vue js 全屏查看 div

// 全屏查看 screenClick() { // screen var docElm = document.getElementById("screen"); // 指定容器id //W3C if (docElm.requestFullscreen) { docElm.requestFullscreen(); } //FireFox else if (docElm.mozReques...

2022-05-08 11:00:34 138

原创 小程序前端获取openId

正常开发中肯定都是通过后台获取调用微信公众平台接口获取openid,说白了就是为了保护一些敏感信息,appid,secret密钥不被泄露,但我们平时自己测试的时候前端也是一样可以拿到,来达到某种功能实现的微信官方提供的接口进行调用 https://developers.weixin.qq.com/miniprogram/dev/api-backend/open-api/login/auth.code2Session.html// 获取openid getOpenId(){

2022-05-04 11:09:07 1832 2

原创 GIT可视化工具 & 代码上传工具

Sourcetree

2022-04-23 13:44:39 761

原创 el-tree展开按钮变成加减号

效果:css 直接加上就可以用了,如果要加在公共样式里面的话把 ::v-deep都去掉就可以了.el-tree ::v-deep .el-tree-node__expand-icon.expanded { -webkit-transform: rotate(0deg); transform: rotate(0deg);}//有子节点 且未展开.el-tree ::v-deep .el-icon-caret-right:before { background: url("...

2022-03-24 16:22:56 2194

转载 vue项目使用Export2Excel导出Excel表格详细步骤

文章转载:https://blog.csdn.net/QQ_Empire/article/details/105795402

2022-03-24 14:36:54 416

原创 js、vue上传限制选择文件的格式

在选择上传文件的时候 只显示已设置的文件格式,其它格式的文件不显示js方法 :通过accept属性设置,<input type ="file" accept="image/jpg, image/png, image/jpeg, image/gif">vue方法也是用accept属性,但格式只需要用后缀名就行<el-upload multiple class="upload-demo" ..

2022-03-16 11:54:22 2413

原创 element-ui 下拉选择树

代码: <el-form-item label="上级部门名称:" prop="sDeptId"> <el-select v-model="addForm.sDeptName" placeholder="请选择" ref="selectReport" > <el-option :value="..

2022-03-09 15:54:10 2449

原创 vue插槽的使用

什么是插槽插槽就是子组件中的提供给父组件使用的一个占位符,用<slot></slot> 表示,父组件可以在这个占位符中填充任何模板代码,如 HTML、组件等,填充的内容会替换子组件的<slot></slot>标签。代码如下:一、匿名插槽1、在子组件中放一个占位符<template> <div> <h1>今天天气状况:</h1> <slot>

2022-03-01 18:41:48 328

原创 vue防止按钮连续点击 (自定义指令)

perventReClick.jsimport Vue from 'vue'const preventReClick = Vue.directive('preventReClick', { inserted: function(el, binding) { el.addEventListener('click', () => { if (!el.disabled) { el.disabled = true

2022-02-18 18:41:55 2473

原创 vue+elementUI正则验证封装

正则表达式封装validator.jsexport default { /** * 数字验证 */ isNumber(rule, value, callback) { if (!value) { //当使用时没有定义text则非空验证默认提示请输入 callback(new Error(rule.text ? rule.text : '请输入')); } else { // cons

2022-02-18 18:35:06 1131

原创 el-dialog蒙层遮住了弹窗

点两次弹窗才关闭解决 标签上加 append-to-body

2022-02-16 16:34:49 471

原创 el-cascader同时拿到id和name

主要是用ref来获取 this.$refs.editCascader.inputValue <el-cascader filterable :show-all-levels="false" :props="{ emitPath: false }" :options="options" v-model="designer"

2022-02-10 15:19:18 2688

原创 vue强制更新子组件

1、强制重新刷新某组件this.$forceUpdate()2、绑定 key//模版上绑定key<SomeComponent :key="theKey"/>//选项里绑定datadata(){ return{ theKey:0 }}//刷新key达到刷新组件的目的theKey++;3、v-if<SomeComponent v-if="iscom" />...

2022-02-08 15:26:24 2145

原创 js两个数组对象去重

先模拟一些数据: let arr1 = [ {id:1,name'小明',age:18}, {id:2,name'小猪',age:12}, {id:3,name'小红',age:16}, {id:4,name'小紫',age:22}, {id:5,name'小绿',age:20}, ] let arr2 =[ {pid:2,sex:女}, {pid:5,sex:男}, ]两个数组通过arr1的id和arr2的pid比较,返回去重后的arr1/

2022-01-29 15:01:16 1720

原创 js用一个数组对另一个数组对象去重

假设我们有一个数组和对象,如下所示:const main = [ {name: "Karan", age: 34}, {name: "Aayush", age: 24}, {name: "Ameesh", age: 23}, {name: "Joy", age: 33}, {name: "Siddarth", age: 43}, {name: "Nakul", age: 31}, {name: "Anmol", age: 21},];const names

2022-01-29 11:27:21 1317

原创 el-form清空验证

this.$refs.extractForm.resetFields();记得要等表单显示出来之后才能使用,否则报错

2022-01-24 15:45:32 1603

原创 vue共用的 混淆 mixin

//引入混淆import { tool } from "../../../utils/common";export default { mixins: [tool],}可以直接调用混淆中的方法this.downloadFile(item.path, item.name);common.jsimport ajax from '@/utils/request'import $ from 'jquery-slim'export const ruleTool = { ..

2022-01-21 11:24:48 874

原创 vue多文件上传,图片需要压缩后转base64

主要通过picCompress .js这个文件进行压缩转base64html <el-upload class="upload-demo" drag :headers="headers" action="#" multiple :show-file-list="false" :before-upload="beforeUpload" > <i class="el...

2022-01-21 10:50:04 1252

原创 base64文件下载

传参 文件名 和 base64编码 //base64文件下载下载 base64DownloadFile(fileName, content) { let aLink = document.createElement("a"); let blob = this.base64ToBlob(content); //new Blob([content]); let evt = document.createEvent("HTMLEvents");

2022-01-21 10:40:57 2575

空空如也

空空如也

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

TA关注的人

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