- 博客(50)
- 收藏
- 关注
原创 iview的select表单验证必填不通过
iview默认校验数据类型为String,而我的select用的id是number类型的,因为type校验类型不一致,所以导致一直验证不通过。iview在表单内使用select下拉框的时候,select验证为必填,我选择了数据,却一直提示验证不通过。
2024-01-18 10:16:17
952
原创 JavaScript十大取整方法
在日常的开发过程中会有各种各样的需求会用到很多不同取整的方法,但是下面的这些方法中应该还是会有你没有用过的方法,了解一下吧。
2024-01-17 16:55:48
659
原创 苹果电脑(Mac)的node版本安装以及升降级
在开发过程中,对于不同的开发环境或者较老的项目可能需要切换不同的node版本,此过程会涉及到node版本的升级与降级,安装node版本管理模块n(sudo命令)。6.检测目前安装了哪些node版本(前面带圈的是你当前使用的版本)4.node版本降级/升级(安装指定 node版本)7.切换 node版本(不会删除已安装的其他版本)5.卸载指定 node版本。8.查看 node版本号。sudo n 版本号。sudo n 版本号。
2024-01-17 16:29:39
3641
原创 js浮点数计算精度问题(输入19.9乘100后结果1989.9999999999998)
在项目中设置商品价格是输入19.9,因为后端存储的是分所以在接口传递参数的时候需要将输入的数乘100,在乘100后出现精度问题。由于浮点型直接计算可能会出问题,所以可以将其先转为整型计算,乘法先去掉小数点,先转为整数乘法,然后再将结果缩小n倍。此方法只解决了乘法的精度问题,因为加减乘除都会存在精度问题,所以可以在这个的基础上改动解决其他的计算精度问题。
2024-01-17 16:00:01
778
原创 微信小程序海报插件Painter 2.0(canvas画图)使用并保存图片到相册案例
Painter通过 json 数据形式,来进行动态渲染并绘制出图片。下载文件保存到components文件夹下。Painter 的优势。
2024-01-17 11:00:10
2062
原创 H5使用ThreeJs展示3D模型(gltf格式)案例
/ 引入three.js import * as THREE from 'three';// 引入扩展库GLTFLoader.js import {import {
2023-07-04 17:06:36
2255
原创 threejs使用Sprite精灵图实现精灵图脉冲(放大缩小)效果
【代码】threejs使用Sprite精灵图实现精灵图脉冲(放大缩小)效果。
2023-07-04 16:53:30
1156
2
原创 threejs平滑地移动相机的位置,将其逐渐接近目标点位置(tweemjs)
注:这里需要在requestAnimationFrame内调用TWEEN.update();一、npm安装tweemjs。二、引入tweemjs。
2023-07-04 16:34:50
3732
原创 Vue页面滚动到底部触发
一、首先要设置需要滚动的盒子,给div添加overflow-y:auto或overflow-y: scroll样式,然后给盒子添加@scroll事件。二、@scroll事件调用内容。
2022-10-17 11:28:50
2876
1
原创 Vue移除监听事件
原生方法放在 beforeDestroy 或者 destroyed 中,移除时会报错,改用 $refs 要获取 dom 节点,这样就不会报错了。
2022-09-14 17:40:44
3676
原创 禁止浏览器页面缩放(Ctrl + 加减/鼠标滚轮、工具栏加减缩放)
【代码】禁止浏览器页面缩放(Ctrl + 加减/鼠标滚轮、工具栏加减缩放)
2022-09-14 17:35:57
1997
1
原创 js(vue)获取本地上传图片的尺寸(宽高)
<input id="file" @change="uploadImegs($event,3)" type="file" accept="image/*" />uploadImegs(e) { let _file = e.target.files[0]; if (_file) { if (!/\.(jpg|jpeg|png|JPG|PNG)$/.test(e.target.value)) { this.$Message.info("图片
2021-11-23 21:42:01
1813
原创 Vue拖拽排序组件Vue-Slicksort
一、效果图二、安装组件 npm i vue-slicksort -S三、使用组件<div class="maintenance_img mt50 mb50 pl20 pr20" style="font-size: 16px;font-weight: 600;position: relative;"> <!-- 拖拽 --> <SlickList :lockToContainerEdges="true" lockAxis
2021-09-03 14:12:56
2236
5
原创 Vue点击下载图片
一、同源//下载二维码的事件downloadImg(imgurl) { var url = imgurl var a = document.createElement('a') var event = new MouseEvent('click') // 自定义下载后图片的名称 a.download = '图片' a.href = url a.dispatchEvent(event)},一、非同源down(imgurl) { // 保存二维
2021-08-31 18:37:34
1052
原创 iView表格(Table)点击展开功能(每一行)
效果图:一、首先我们要在表格(Table)上添加绑定每行的点击事件@on-row-click<Table @on-row-click="onExpand" border :columns="columns" :data="list"></Table>二、在表格(Table)的表头columns中添加一列{ type:'expand', width:30, render:(h,params)=>{ return h('Table
2021-08-11 15:35:58
3206
3
原创 iView输入框禁止输入特殊字符,只可输入中文、数字、字母
一、HTML<Form-item label="导出名称: "> <Input v-model="file_name" @on-keyup="btKeyUp()" @on-keydown="btKeyDown()" type="text" style="width: 280px" clearable placeholder="请输入导出名称" /></Form-item>二、JS//只能输入汉字英文数字btKeyDown(name) { thi
2021-08-09 22:33:50
1906
原创 Vue动态设置样式和class名
一、动态设置样式<template> <div :style="{backgroundImage: 'url(' + bgimg + ')', fontSize:'size'}"></div></template><script> export default { data() { return { bgimg: "https://jm-images.oss-cn
2021-08-09 11:54:44
795
原创 iview树形数据格式化(递归)
问题:在我们使用iview树形组件的时候,因为后台返回的数据的key值没有办法在iview树形结构中使用,所以我们就要先把数据格式化后才可使用。1、方法//转树形结构数据convertTree(tree, map) { const result = []; tree.forEach((item) => { // 读取 map 的键值映射 let expand = false; let title = item[ map.title
2021-07-28 18:43:38
779
原创 js数组调换两个元素的位置
1、方法一let arr = [1, 2, 3, 4, 5]let t = ""// 交换第三个和第四个元素let x = 3, y = 4let t = arr[x];arr[x] = arr[y];arr[y] = t;console.log(arr) /// [1,2,4,3,5]2、方法二let arr = [1, 2, 3, 4, 5]// 交换第三个和第四个元素let x = 3, y = 4 arr.splice(x - 1, 1, ...arr.splice
2021-07-27 11:08:25
6178
2
原创 iview表格(table)组件划过时选中的颜色修改
.ivu-table-row-highlight td, .ivu-table-stripe .ivu-table-body tr.ivu-table-row-highlight:nth-child(2n) td, .ivu-table-stripe .ivu-table-fixed-body tr.ivu-table-row-highlight:nth-child(2n) td, tr.ivu-table-row-highlight.ivu-table-row-hover td{ backgro.
2021-07-27 10:12:52
669
原创 vue监听url地址栏参数变化
问题:在开发过程中我们有可能会遇到一个问题,就是在一个vue项目中引入了一个组件,点击这个组件跳转的还是当前的页面,只是传递的参数发生了变化,这个时候我们传递的参数就不能正常的赋值了,这是因为页面没有重新加载,所以我们就要监听地址栏的参数变化了。1、传递参数 this.$router.push({ path: url,//路由地址 query:{//参数 type: 1 } });2、监听参数变化 watch: { //监听路由地址的改变
2021-06-30 11:44:33
6581
原创 vue插件实现刮刮乐效果(移动端、PC端)
效果使用方法1、使用npm下载安装插件npm install lzy-scratch-card --save2、在需要使用的页面引入组件import scratchCard from 'lzy-scratch-card'components: { scratchCard},3、在项目中使用<template> <div class="index-body"> <scratch-card elem
2021-05-26 17:32:00
3687
6
原创 H5微信分享的规则
1、微信分享用户调用微信的分享功能,可以自定义分享的title和描述,以及小图标和链接。可以分享到群、好友、朋友圈、QQ、QQ空间等。2、分享设计规范分享标题:14字以内,建议使用朋友般亲切的口吻分享图标:尺寸120*120,大小不超过10K,不支持GIF格式。必须采用https协议。分享描述:20字以内,对标题的简要解读。分享链接:外链页面所在服务器至少能支持每秒1500次的访问压力,且每次访问的响应时间200ms以内。必须采用https协议。分享行为:页面上无分享按钮,页面上无诱导分
2021-05-25 10:54:36
3318
原创 在Vue中生成二维码(前端生成二维码:Qrcode)
1、首先我们需要使用"npm install --save qrcode"下载依赖包npm install --save qrcode2、在要使用qrcode的页面导入qrcodeimport QRCode from "qrcode";3、template<template> <div class="index-body"> <div class="qrcode"> <img :src="qrcode"
2021-05-21 14:34:19
1470
1
原创 vue禁止微信内H5上下拉动页面
preventDefault() 方法不会阻止事件通过 DOM 进一步传播。请使用 stopPropagation() 方法来解决。如果事件是可取消的,则 preventDefault() 方法会取消该事件,这意味着属于该事件的默认操作将不会发生。并非所有活动都可以取消。请使用 cancelable 属性 来确定事件是否可取消。
2021-04-21 09:40:42
1949
原创 小程序页面跳转的三种方法及传参以及返回上一页方法
wx.navigateBack:返回上一页的方法wx.navigateBack({ delta: 1, // 返回上一级页面。 success: function() { console.log('成功!') }})wx.navigateTo:保留当前页面,跳转到小程序内的某个页面。wx.redirectTo:关闭当前页面,跳转到应用内的某个页面。wx.switchTab:跳转到tabBar页面,并关闭其他所有tabBar页面。注:第一个和第二个方法是不可以跳转tabbar设
2021-03-08 12:00:15
854
原创 后台返回的内容中有两个空格,显示到前端页面上只有一个空格
主要是浏览器默认只认同字符中间的一个空格,其他忽略掉。<pre></pre>标记<xmp></xmp>标记用以上两个标记包裹住你需要浏览器按照你的预编排的格式输出的内容,这样就可以解决这个问题了。...
2021-03-05 15:08:11
2735
1
原创 小程序关闭所有页面跳转到指定页(小程序页面跳转)
在小程序开发过程中,有时候会遇到两个页面来回跳转多次后不能打开页面的情况,这时候我们要关闭之前的页面才能继续跳转。// 关闭所有页面跳转到某一页wx.reLaunch({ url: '/pages/index/index'});...
2021-03-05 10:57:19
3877
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人