寒墨茗殇-CSDN博客

原创 uniapp使用addInterceptor路由拦截(vue2 OR vue3)

- 主要通过`uni.addInterceptor`api进行路由拦截- 目前小程序上面对于uniapp提供的路由跳转方式可以实现拦截，自带的返回按钮，底部tabbar切换无法拦截他们的跳转，但是可以监听到to和from- h5支持路由全部拦截- 支持vue2、vue3- 通过`this.$Route`或者`const {proxy}=getCurrentInstance();proxy.$Route`可以拿到当前页面的路由信息- 目前测试了h5、微信小程序、支付宝小程序、抖音小程序。其他的待测试

2023-04-06 16:07:52 3604 8

原创 elementUi相关问题（及循环表单验证、隐藏滚动条）

elementUi相关问题总结

2023-02-15 15:16:07 3761

原创【javascript】原生js对Dom节点的操作方法总结（一）

原生js对Dom节点的操作方法总结,getComputedStyle,节点位置，getBoundingClientRect，滚动监听，getAttribute，setAttribute,DOM节点创建节点、添加节点、删除节点、复制节点、替换节点,判断节点类型,获取元素(document.getElementById等)，节点关系及获取方式innerHTML 、 innerText、outerhtml的区别

2022-09-28 10:03:05 3502

原创监听浏览器刷新事件,拦截浏览器返回，js监听移动端浏览器页面显示、隐藏

注: onbrforeunload和onunload都会在刷新和关闭页面是触发，但是onbeforeunload在onunload之前执行，并且它还可以阻止onunload的执行。那么在页面刷新时执行顺序就是onbeforeunload、onunload、onload。

2022-08-08 13:24:38 10279

原创 Elementui，通过Dialog，实现全局动态confirm自定义弹窗，不需要各页面单独引入组件（可显示页面、html、代码高亮显示、普通文字）

Elementui，通过el-dialog，实现confirm 弹窗

2022-06-23 15:34:22 10489

原创 iframe跨域传值

前端iframe跨域传值、postMessage跨域

2022-06-21 09:40:36 1097

原创文本输入，js防注入，识别网址,清除富文本html,修改富文本图片样式

文本输入，js防注入，识别网址

2022-06-06 15:48:31 446

原创 vue 全局动态修改title、keywords、description；vue常用挂载的方法，自定义指令；

const install=(Vue,router)=>{ // 跨页面传值 //this.$HWBUS.$on('fn',res=>{ // console.log(res) // })//监听 // this.$HWBUS.$emit('fn',999)//传值 Vue.prototype.$HWBUS=new Vue() // 打印操作 // html:需要打印页面的html代码，样式必须行内 // ..

2022-04-15 13:54:44 5347

原创 vueX 自动匹配modules，vueX插件vuex-persistedstate自动存储本地,vue 自动引入所有路由，vue批量引入组件

vueX按模块写，需要手动引入模块，可以通过代码自动引入，方便快捷代码：// 自动匹配modules目录下的js文件作为store的modules，所以新增store模块的时候必须添加在modules目录下const moduleFiles = require.context('./modules', true, /\.js$/);const modules = moduleFiles.keys().reduce((modules, modulePath) => { const..

2022-04-11 09:52:28 1742

原创浏览器判断麦克风和摄像头权限

方法： getAudioVideo(constraintsData){ if (navigator.mediaDevices === undefined) { navigator.mediaDevices = {}; } if (navigator.mediaDevices.getUserMedia === undefined) { navigator.mediaDevices.get

2022-01-24 10:27:03 2426

原创 Echarts雷达图单独设置拐点颜色，边框颜色，区域颜色

<template> <div id="echartBasic"></div></template><script>import * as echarts from 'echarts'export default { mounted() { var chartDom = document.getElementById('echartBasic') var myChart = echarts.init(chartDom)

2024-10-16 15:58:46 798

原创 echarts双Y轴,并实现图例等

一个Y轴时yAxis为对象yAxis: { type: 'value', name: '占比(%)'},两个Y轴时yAxis为数组 yAxis: [ { // 左侧的 type: 'value', name: '占比(%)', nameTextStyle: { padding: [0, 0, 10, -50] },

2024-05-06 11:07:28 1120 2

原创绘制空心环形

* 伪类旋转好多度，执行两次，如果大于180度；执行第二个动画，改变颜色，同时旋转度数执行的二次 */-#### js计算三角函数。

2024-04-01 00:00:00 1277

原创 uniapp 图片懒加载,图片懒加载

/ 滚动区域，不传默认是页面。// 错误显示的图片。

2024-03-07 13:53:07 1888 2

原创 Math方法，以及三角函数计算

【代码】Math方法，以及三角函数计算。

2024-02-23 11:55:16 365

原创 el-upload实现可替换、删除、预览的图、音、视(可切片)上传。js 往返缓存（可判断当前页面是不是返回的页面）

el-upload实现可替换、删除、预览的图片上传BFCache是一种浏览器优化，可实现即时前进和后退载入页面。它改善了用户的浏览体验，尤其是那些网络或设备速度较慢的用户。`*我们可以通过这个方法判断当前页面是不是返回的页面*`

2024-01-10 17:33:15 1171

原创 render 函数中使用组件等

用来访问作用域插槽。对于包括默认 slot 在内的每一个插槽，该对象都包含一个返回相应 VNode 的函数。vm.$scopedSlots 在使用渲染函数开发一个组件时特别有用。由于 render 函数中没有 v-bind、v-on 等内置指令，因此我们将如何使用呢？

2024-01-08 10:30:12 603

原创判断浏览器返回页面，app内嵌h5离开返回页面

BFCache是一种浏览器优化，可实现即时前进和后退载入页面。它改善了用户的浏览体验，尤其是那些网络或设备速度较慢的用户。

2023-12-13 11:07:36 692

原创 vue3+element-plus+vue-cropper实现裁剪图片上传

vue3+element-plus+vue-cropper实现裁剪图片上传裁剪图片上传vue-cropperelement-plusvue3

2023-12-01 00:15:00 1865

原创图片复制上传，拖拽输入框上传，el-upload自定义上传方法（上传和备注框强关联）

1. 效果图：2. 复制图片使用的方法：1.通过监听paste方法，获取复制内容2.获取复制内容中的clipboardData3.获取file文件进行上传<input @paste.native="handlePaste" />handlePaste(value){ let files = value.clipboardData.files if(files){ files=files[0] }else{ files=valu

2023-11-04 18:47:14 394

原创 input和原生js文件上传

input 标签主要有以下几个属性。// 获取选择图片的base64。options(可选参数)// 上传的file图片。

2023-11-01 00:15:00 423

原创通过css和js实现多行文本省略时省略号不在最右边

现在省略是到了最右边的，我们需要让省略号在中间的地方。最终我们需要多个右浮动元素，让。所以我们需要使用浮动让设置的。但是这样会存在右边空出一块。然后我们来写多行文本省略。

2023-10-30 15:14:44 349

原创 vue通过draggable实现拖拽功能

【代码】vue通过draggable实现拖拽功能。

2023-09-02 00:00:00 2273

原创【wxPay】微信支付

get_brand_wcpay_request:cancel ：支付过程中用户取消。cancel：用户点击取消时的回调函数，仅部分有用户取消操作的 api 才会用到。complete：接口调用完成时执行的回调函数，无论成功或失败都会执行。get_brand_wcpay_request:fail : 支付失败。get_brand_wcpay_request:ok ：支付成功。success：接口调用成功时执行的回调函数。fail：接口调用失败时执行的回调函数。

2023-09-01 00:15:00 475

原创【webpack】动态配置cdn，多模板入口项目搭建

查看当前项目 webpack 配置，进而知道注入 cdn 模块的名称。此时配置成功后，公共页面路由是这样的。，配置对应多项目的对应路由。合并时需要调用封装的方法。,对应项目的路由是这样的。,获取目录下的文件名称。,配置多项目的功能页面。按照这个模板创建项目。，动态生产 page。last. 具体文档。

2023-08-09 16:30:01 387

原创 javascript和css实现瀑布流排列

使用Grid 布局、multi-column 多列布局、flex 布局、js动态计算实现瀑布流布局

2023-07-01 00:15:00 854

原创安装 vue-element-admin，安装报错解决

强烈建议不要用直接使用 cnpm 安装，会有各种诡异的 bug，可以通过重新指定 registry 来解决 npm 安装速度慢的问题。package.json 的 tui-editor 修改为"@toast-ui/editor": “^3.1.3”,因为包要进行升级。另外因为 node-sass 是依赖 python环境的，如果你之前没有安装和配置过的话，需要自行查看一下相关安装教程。Windows 用户若安装不成功，很大概率是node-sass安装失败，解决方案。

2023-06-01 00:15:00 648

原创 css奇淫巧计

可选值:none （无），circle （圆圈），disc （圆形），square （正方形）-inherit会继承来着父元素的对应值。

2023-05-01 00:15:00 2214

原创微信小程序返回拦截

微信小程序返回拦截弹窗1.自定义顶部，并改写`navigateBack`2.使用微信提供的`page-container`

2023-04-14 11:54:50 1190 1

原创 uniapp中全局页面挂载组件（小程序，h5）

从HBuilder X创建的uniapp项目没有vue.config.js文件所以需要建一个。6.在pages.json文件中配置 insetLoader。5.全局引入组件引入到全局注册，可以在mian.js里面。3.创建vue.config.js 文件。1.首先需要把uniapp项目初始化。6.然后我们在再封装公共的方式进行使用。同时我们也可以在某个路由里面单独引入。

2023-04-07 11:37:33 8670 15

原创 SheetJS实现js获取、导出表格数据

XLSX.utils.sheet_add_aoa(worksheet, Array[][])：将二维数组中的数据添加到已有的worksheet中。XLSX.utils.sheet_add_json(worksheet, Object)：将js对象中的数据添加到已有的worksheet中。// XLSX.utils.json_to_sheet(SheetObject.Sheet1)：再次转换为工作表。XLSX.utils.sheet_to_json(worksheet): 将表格数据转化为json格式。

2023-03-06 11:05:49 1998 1

原创 Vue.config.js 配置报错 ValidationError: Invalid options object

这段报错信息意思是Dev Server已使用与API模式不匹配的选项对象初始化，其中明确指出是属性 disableHostCheck，于是我屏蔽了这个属性，发现能启动成功此时我查看了之前和这次的项目的webpack的版本发现这次的版本是 webpack5 之前是webpack4，并且查看了webpack的文档发现disableHostCheck 这个属性在webpack4中已经被删...

2023-02-28 20:15:26 627

原创 Ventoy安装deepin系统（windows和deepin双系统）

Ventoy安装deepin系统（windows和deepin双系统）,虚拟机安装系统

2023-02-02 14:25:23 5049

原创 Ventoy制作启动U盘安装教程,以及不需要格式化U盘安装Ventoy方法

Ventoy是一款国人开发的新一代多ISO启动引导程序，用户只需要将所需的ISO镜像文件拷贝至优盘中即可在Ventoy界面中选择自己想要的ISO镜像文件。以及不需要格式化U盘安装Ventoy方法

2023-02-01 00:00:00 27344 3

原创 Ventoy主题美化，以及自行制作方法

Ventoy是基于grub2 所制作的，所以可以自行制作或者将现成的主题套用到Ventoy。下面提供了直接使用就可以美化Ventoy主题的文件，和自信修改grub2 主题达到适用于Ventoy的方法

2023-01-12 14:34:56 14100 2

原创图片base64，file,blob格式的相互转换，以及gif转base64

图片base64，file,blob格式的相互转换，以及gif转base64

2022-12-02 12:00:00 2527

原创 vue动态挂载组件

vue动态挂载组件

2022-12-01 12:00:00 1697

原创 ElementUI实现在下拉列表里面进行搜索

ElementUI实现在下拉列表里面进行搜索

2022-11-28 17:44:36 5158

原创 input空格回车输入标签

input空格回车输入标签。

2022-11-22 21:36:15 1303 1

原创 elementUi表单滚动到错误提示位置,删除选择标签

当elementUi使用form表单验证时,验证不通过就会出现错误提示,表单过长错误不能明确知道具体错误在哪里,因此需要滚动到错误提示的地方。删除选择标签

2022-11-01 01:00:00 828

uniapp实现吸顶，吸底

uniapp实现吸顶，吸底通过createSelectorQuery方法监听，提高性能

2023-04-23

uniapp路由拦截，uniapp使用addInterceptor路由拦截(vue2 OR vue3)

uniapp路由拦截 - 主要通过`uni.addInterceptor`api进行路由拦截 - 目前小程序上面对于uniapp提供的路由跳转方式可以实现拦截，自带的返回按钮，底部tabbar切换无法拦截他们的跳转，但是可以监听到to和from - h5支持路由全部拦截 - 支持vue2、vue3 - 通过`this.$Route`或者`const {proxy}=getCurrentInstance();proxy.$Route`可以拿到当前页面的路由信息 - 目前测试了h5、微信小程序、支付宝小程序、抖音小程序。其他的待测试

2023-04-06

uniapp小程序项目创建模板

uniapp创建模板，主要是使用的是vue2 使用了接口加解密（crypto-js）路由拦截（uni-read-pages，uni-simple-router）全局引入公共组件，页面不需要单独写组件标签（vue-inset-loader）

2023-03-28

uniapp、小程序省市区选择,拉起弹窗选择

uniapp省市区选择,拉起弹窗选择，存在拉起动画，默认填值，监听改变。

2022-07-29

clipboard.min.js 实现复制图文信息，（vue 里面可以使用）

clipboard.min.js 实现复制图文信息，（vue 里面可以使用）博客链接：https://blog.csdn.net/qq_40591925/article/details/125282512?spm=1001.2014.3001.5502

2022-06-14

动态生成烟花，烟花绽放特效。

const widthOffset =100； const heightOffset =100； new Fireworks({ el: "canvasF", //id width: widthOffset, height: heightOffset, style: { position: "relative", top: "0", left: "0", "background-color": "rgab(0,0,0,0)", "z-index": 2, }, isClick: true, isAuto: true, frequency: 1000, });

2022-01-24

小程序日历组件版(可控制是否显示农历)

微信小程序酒店选择区间日历组件版，可通过参数实现是否显示农历日期。博客：https://blog.csdn.net/qq_40591925/article/details/84834692 ( ios显示问题解决：将：var startWeek = new Date('' + year + '，' + month + '，1').getDay(); 该：var startWeek = new Date('' + year + '/' + month + '/1').getDay(); )

2019-08-07

微信小程序酒店选择区间日历组件版（可通过参数实现是否显示农历日期）

(链接："https://download.csdn.net/download/qq_40591925/11489494" ——同样的，便宜些。)微信小程序酒店选择区间日历组件版，可通过参数实现是否显示农历日期。博客：https://blog.csdn.net/qq_40591925/article/details/84834692 ( ios显示问题解决：将：var startWeek = new Date('' + year + '，' + month + '，1').getDay(); 该：var startWeek = new Date('' + year + '/' + month + '/1').getDay(); )

2019-04-19

php版微信小程序会员卡创建、领取、激活、删除、查看通过

php版微信小程序会员卡创建、领取、激活、删除、查看功能，流程依次走完。 php版微信小程序会员卡创建、领取、激活、删除、查看功能，流程依次走完。 php版微信小程序会员卡创建、领取、激活、删除、查看功能，流程依次走完。 php版微信小程序会员卡创建、领取、激活、删除、查看功能，流程依次走完。

2019-02-18

php版微信小程序会员卡创建、领取、激活、删除、查看

php版微信小程序会员卡创建、领取、、删除、查看功能，流程依次走完。

2019-02-15

微信小程序下拉刷新组件

自己做的小程序下拉组件，有两种下拉样式，根据要求返回各种值,参数说明见页面自己做的小程序下拉组件，有两种下拉样式，根据要求返回各种值,参数说明见页面

2019-01-17

JQ网页版农历日历（JQ网页版农历日历）

该插件可以直接显示日历，同时可以监听选择日期。同时可以在input 框中调用日期选择控件。改插件可以直接显示日历，同时可以监听选择日期。同时可以在input 框中调用日期选择控件。

2018-12-24

网页版日历控件含农历日期（原生js实现）

网页版日历控件，可以查询1901-2099期间的日历，含有农历日期。网页版日历控件，可以查询1901-2099期间的日历，含有农历日期。网页版日历控件，可以查询1901-2099期间的日历，含有农历日期。

2018-12-08

微信小程序酒店区间日历(含农历日期)

(链接："https://download.csdn.net/download/qq_40591925/11489494" ——更好，还便宜一个币。)该小程序主要是显示未来6个月的日期（含农历）状况，以平铺的形式进行。主要用于酒店的日期选取 ( ios显示问题解决：将：var startWeek = new Date('' + year + '，' + month + '，1').getDay(); 该：var startWeek = new Date('' + year + '/' + month + '/1').getDay(); )

2018-12-06

空空如也

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

TA关注的人