- 博客(62)
- 收藏
- 关注
RSS订阅原创 vue3+Pinia的使用 - 封装
监听piain中的数据更新：数据变化就会触发。persist.ts 可存储到本地。存储数据：general.ts。
2024-03-27 16:18:04
289
原创 el-table分页时多选数据的保存和回显
2、分页获取新数据之后匹配当前页应该选中的数据，使用 multipleTableRef.value!把所有选择的数据全部存到一个大数组中，切页的时候匹配原数据利用ref节点的.toggleRowSelection方法进行回显。1、勾选和全选时需要判断是选中还是取消，然后更新大数组数据。所有代码：（示例为前端分页）
2023-12-04 14:35:18
1222
原创 el-pagination 纯前端分页
实现思路：先把数据存储到一个大数组中，然后调用方法进行切割。主要使用数组的slice方法。需求：后端把所有数据都返给前端，前端进行分页渲染。
2023-12-04 12:12:36
697
原创 vue超好用的自定义指令封装
vue自定义指令 自定义防抖指令 自定义节流指令 自定义复制指令 自定义长按指令 自定义拖拽指令 自定义水印指令 自定义旋转指令
2023-11-22 12:05:36
375
转载 解决跨域的方法
跨域的常见的五种解决方案如下1、jsonp，代表：jquery的$.ajax。（仅限JQuery项目使用）2、script标签解决跨域（远古web使用的方案，已不建议使用）3、前端代理4、nginx代理5、设置响应头（不建议使用，安全性不高，小练习可以用用，方便）
2023-04-20 15:41:07
61
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
905
原创 小程序带参数返回上一级 wx.navigateBack（）返回传参
getCurrentPages();//直接调用上一个页面对象的setData()方法，把数据存到上一个页面中去，然后再返回
2022-09-01 11:04:33
601
原创 微信小程序保存图片的方法
下载（wx.downloadFile） + 保存（wx.saveImageToPhotosAlbum） +授权（wx.openSetting）
2022-06-23 15:26:37
3807
1
原创 切换npm的淘宝镜像
切换npm淘宝镜像npm config set registry https://registry.npm.taobao.org
2022-06-08 16:10:00
242
原创 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
7176
原创 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
124
原创 小程序前端获取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
1688
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
1927
转载 vue项目使用Export2Excel导出Excel表格详细步骤
文章转载：https://blog.csdn.net/QQ_Empire/article/details/105795402
2022-03-24 14:36:54
377
原创 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
2264
原创 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
2383
原创 vue插槽的使用
什么是插槽插槽就是子组件中的提供给父组件使用的一个占位符，用<slot></slot> 表示，父组件可以在这个占位符中填充任何模板代码，如 HTML、组件等，填充的内容会替换子组件的<slot></slot>标签。代码如下：一、匿名插槽1、在子组件中放一个占位符<template> <div> <h1>今天天气状况：</h1> <slot>
2022-03-01 18:41:48
307
原创 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
2298
原创 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
1057
原创 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
2431
原创 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
2063
原创 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
1696
原创 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
1283
原创 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
816
原创 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
1186
原创 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
2480
原创 el-tree只能同级拖拽排序
<el-tree :data="treeData" node-key="id" :indent="0" default-expand-all @node-click="treeNodeClick" :expand-on-click-node="false" draggable :allow-drop="allowDrop" ...
2022-01-20 18:18:44
3055
2
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人