- 博客(48)
- 收藏
- 关注
原创 multipleTable.value.toggleRowSelection 失效
监听初始化选中的数据,我们需要用获取的表格数据去对比回显数据,有就用表格的数据去匹配multipleTable.value.toggleRowSelection。表格是封装的一个组件,我在别的页面使用到了,需要把别的页面回显的数据传到表格组件里面。可以看到图片上是获取到了test用户的,但是我们的勾选没有勾上。我们可以看到已经可以成功回显了。
2024-05-24 16:21:14
515
原创 redux的简单用法
在代码里面进行取值使用方法,pages。4.store的index代码。3.store的user代码。挂到indexjs上。
2024-05-07 14:10:25
197
原创 es6新特性,const定义的值是否能够被改变
通俗来讲:const存储的是一个常量地址,不能改变这个地址,但是可以改变这个地址里面的东西。通俗来讲:就是const定义的值是一个常量,不可以再被改变。但是看文档中又介绍了它的本质。
2024-03-01 14:59:23
297
原创 使用Fabric创建的canvas画布背景图片,自适应画布宽高
之前的文章写过vue2使用fabric实现简单画图demo,完成批阅功能;但是功能不完善,对于很大的图片就只能显示一部分出来,不符合我们的需求。这就需要改进,对我们设置的背景图进行自适应。创建的具体代码请看之前的文章,这里只提供解决办法。主要是 使用scale在x轴和y轴上进行缩放。修改后的画布背景就可以自适应了。js部分,重写了设置背景的方法。有问题的canvas画布背景。
2024-02-29 15:23:39
2211
5
原创 自定义农历日期进阶版:vue3使用v-calendar日历,选中当前日期并且显示农历跟节假日
js部分就是把 getLunarDate(day.id)实现出来,调用LunarCalendar.solarToLunar函数自动计算,最后只需要判断返回节日还是农历日期。主要过程:在v-calendar的基础上使用自定义插槽,自定义内容,再使用lunar-calendar三方库进行计算。之前有一篇文章根据v-calendar来写日历,但是只显示了阳历日期,后面需求增加,还要加上农历。注意最后一个问题就是节假日标红,我使用的css样式来控制,用的是Less语言。v-calendar的插槽。
2024-02-29 15:06:10
2598
原创 vue如何实现列表自动滚动、向上滚动的效果(vue-seamless-scroll)轮播表
研究了一个插件 列表自动滚动的插件感受这是个做大屏可视化时可靠帮手请欣赏一下效果图如图所示可以看到 它自动向上滚动 以及进入表格则停止滚动/* 表格内背景颜色 */.item{一般在中经常会看到无缝滚动的表格,即轮播表,我们可以使用 vue-seamless-scroll 来实现,使用起来也很方便111。
2024-02-28 13:14:51
87
原创 vue2使用fabric实现简单画图demo,完成批阅功能
js部分,主要是把要批阅的图片设置为背景图片进行标记批阅。这个功能主要实现批阅的,修改上传的图片,标记内容。主要是根据fabric这个库来进行完成的。遇到的问题,线上链接的图片跨域了。解决办法,设置图片的时候处理跨域。
2024-02-28 11:45:22
750
原创 vue下载本地xlsx文件
这是因为我们用的是vue,打包的时候会找不到该文件,只需要放到public下面就可以了。导入本地的路径,会发现报错,找不到该文件。这样就下载本地的xlsx文件成功了。
2024-01-19 10:19:02
1031
原创 引入三方库screenfull库实现全屏,监听f11退出失效
可以打印看到页面上我们发现当request()请求的时候,打印‘1111’并没有出现,所以在request()函数里监听是失效的,解决办法很简单。js实现,根据我们进入全屏是一样的代码,我们是根据iFullScreen来进行判断右上角按钮的变化,我们单纯的点击是可以实现的。我们需要切换按钮变化的时候,直接在html中的style判单当前屏幕的状态,就不需要用到js。注意:如果我现在按了键盘上的f11退出全屏进入全屏,就会出行问题,按钮没有变化。现在我们右上角就需要一个按钮来进行切换全屏的实现。
2023-09-06 21:28:20
719
原创 ant design vue(vue3)的a-tree组件点击文字实现菜单展示
我们把文档中的两个值都打印出来,发现我们点击小三角得到值是我们所点击行对应的key值,主要是就把我们文字所得到的key绑定到expandedKeys上,就可以实现点击文字实现展开。首先进行一个判断,我们展开值expandedkeys里面有没有 值,如果没有值,直接点击文字是不生效的,如果没有值,这一步直接把key赋给它就好了。首先是选中文字的函数,我们可以得到一个key跟name,key就相当于是一个主键,name就是我们所点击行的信息。expandeKeys绑定到a-tree的值,它选中的值会默认展开。
2023-09-06 21:08:55
1840
原创 保留两位小数,不要四舍五入,截取前两位
我的主要思路是把我的数据变成字符串数组,整数部分和小数部分分开,然后对小数部分判断有没有小数,没有直接添加两个0,有一位往后边添加一个0,如果有多位小数直接截取前两位即可。
2023-08-16 22:56:44
379
原创 vue+ant-----收据的实现
主要是把我们页面中数据取到,然后把获取到金额转换成大写就行了。主要就是要把上一个页面的数据传递过来,父传子,相信大家都会。body代码,其实就是根据所需要的样子把收据画出来。最重要的就是js部分了。
2023-08-15 23:00:24
454
原创 前端完成之微信支付功能
最近在写小程序,需要微信支付。微信支付对于前端来说挺简单的,主要完成的功能都是在后端的。最后,在调试环境中得到的一个二维码,在真实的环境中,就会变出输入密码支付了。获取到我们的openid,就可以进行下单支付操作了。首先要获取用户的openid。
2023-08-08 22:06:30
208
原创 vue3+aplayer 做一个音乐播放器功能
父组件中调用:<a-player :data="record" />封装一个aplayer.vue的组件。下载:npm i aplayer。
2023-07-26 21:45:31
1927
5
原创 vue3+ant design 实现月份区间选择限制
我们查找ant的api,可以找到禁用日期的disabledDate和选择第一个就会触发的函数calendarChange。要实现的效果就是禁用当前月份以后的日期,并实现动态选择月份,最多只能选择12个月。动态实现选择最多12个月的区间。禁用当前月份以后的日期。
2023-07-26 21:23:51
1579
转载 前端扫一扫功能
body里面的点击事件调用的函数,点击触发扫一扫功能。第三步:在body中写一个点击事件的元素。今天做的一个功能是企业微信扫一扫功能。大概功能就是扫描二维码,即完成这项功能。第二步:在main.js文件中引入。第四步:在script中写入。getCofig()函数。
2023-07-17 22:03:11
836
原创 面试题:ES6新增说说let和const
const声明一个只读的常量, 一旦声明,常量的值就不能改变,跟let一样存在着块级作用域,暂时性死区,不允许变量提升PI=3 // 报错注意:const声明的变量不得改变值,这意味这,const一旦声明变量,就 必须立即初始化,不能留到以后赋值,只声明不赋值会报错const a //报错本质:const实际上保证的,并不是变量的值不得改动,而是变量指向的那个内存地址所保存的数据不得改动。对于简单类型的数据(数值,字符串,布尔值),值就保存在变量指向的那个内存地址,因此等同于常量。
2023-06-30 11:43:28
81
原创 解决vue2 表格自适应
给el-table一个属性: :max-height='maxHeight'css代码 弹性盒布局,给table flex:1。js代码 在生命周期mounted动态监听变化的高度。
2023-06-29 13:57:02
423
转载 面试题之前端性能优化
SPA项目,一个路由对应一个页面,如果不做处理,项目打包后,会把所有页面打包成一个文件,当用户打开首页时,会一次性加载所有资源,造成首页加载很慢,降低用户体验。SPA单页应用,无论是vue还是react,最初的HTML都是空白的,需要通过加载js将内容挂载到根节点上,这套机制的副作用,会造成长时间的白屏。async,defer是script标签的专属属性,对于网页中的其他资源,可以通过link的preload,prefetch属性来预加载,除了路由的懒加载外,组件的懒加载在很多场景下也有重要的。
2023-06-29 13:34:36
369
原创 nodejs koa
**当用户只有登录成功的时候才能进去首页 那么 系统里除了登录/注册这些功能外 其余的功能是不是都需要一个权限 怎么实现了 就是当前端提交用户名和密码到后端后,后端判断是否正确如果正确那么返回给前端一个token(也就是很长的字符串),前端拿到后放入到以后请求的header里面,每当一个请求来时都要先判断一个这个token有没有效(下面我们仅仅用代码去实现jwt 需要packege.json中添加jsonwebtoken)// 只允许指定域名http://localhost:8080的请求。
2023-06-27 11:43:46
588
原创 vue2响应式样式失效
解决方法2,利用$set方法:向响应式对象中添加一个 property,并确保这个新 property 同样是响应式的,且触发视图更新。body代码,给每个for循环渲染的节点绑定一个点击事件。一开始我用的下标来进行判断高亮显示,但是进行增删查操作,再进行点击样式就乱套了。在做一个菜单列表的时候,点击那个节点那个进行高亮显示,会对其进行增删改查,样式如下。最开始的解决办法是用的是$event事件来进行处理,但是会造成资源消耗,重排重绘。js代码,判单点击的事件是存在的,判单不能点击别的样式类名。
2023-06-27 11:23:47
310
原创 判断input中输入的字符串是数字还是字符串
编写过程中没有用到表单,直接用的element ui 中的input框,但是要判断输入的是不是数字。最开始想的是用 typeof(value*1) ,结果都是得到的number类型。
2023-06-27 10:44:15
450
原创 parcel快速开始小demo 学习笔记
parcel是一个极速零配置Web应用打包工具Parcel 是 Web 应用打包工具,适用于经验不同的开发者。它利用多核处理提供了极快的速度,并且不需要任何配置。
2023-06-19 11:50:28
90
原创 运行parcel index.html ,报错无法加载文件 C:\Users\Administrator\AppData\Roami 运行脚本出错
解决办法以管理员方式运行powershell。敲 A 或者 Y 就可以了。
2023-06-19 11:25:42
258
原创 vue3手动封装一个点击滚动,左右切换的商品展示效果图,纯js
从底部的第三张图片开始到末尾的第八张图片都是居中显示。点击左右要进行切换,也要居中显示。所以我在这里用的的时在X轴上进行平移来进行实现。
2023-06-17 09:33:19
2619
2
原创 pinia实现持久化存储
Pinia 是 Vue 的存储库,它允许您跨组件/页面共享状态。如果您熟悉 Composition API,您可能会认为您已经可以通过一个简单的。当我们的跨组件/页面实现通信的时候,每次刷新浏览器都会发现存储在pinia中数据消失了,因为数据是存储在内存中的原因。. 这对于单页应用程序来说是正确的,但如果它是服务器端呈现的,添加这个属性即可实现持久化存储。
2023-06-13 10:32:13
1658
原创 Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-
Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-
2023-06-13 09:14:54
115
原创 css伪元素实现右边的分割线
创建一些不在文档树中的元素,并为其添加样式。就是选取某些元素前面或后面这种普通选择器无法完成的工作,虽然用户可以看到这些文本,但是这些文本实际上不在文档树中。:before和:after的作用就是在指定的元素内容(而不是元素本身)之前或者之后插入一个包含content属性指定内容的。改进一哈,清除最后一个.spans_s的¥符号。看看效果,每一个元素后面都加上了一个伪元素¥。
2023-06-09 10:08:17
631
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人