- 博客(63)
- 收藏
- 关注
原创 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
转载 解决跨域的方法
跨域的常见的五种解决方案如下1、jsonp,代表:jquery的$.ajax。(仅限JQuery项目使用)2、script标签解决跨域(远古web使用的方案,已不建议使用)3、前端代理4、nginx代理5、设置响应头(不建议使用,安全性不高,小练习可以用用,方便)
2023-04-20 15:41:07 84 1
原创 小程序上传图片的方法 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
原创 微信小程序保存图片的方法
下载(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
原创 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
原创 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-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
原创 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关注的人