- 博客(34)
- 收藏
- 关注
原创 Vue3+Ts:实现paypal按钮
前言:到了让我激动人心的时刻,paypal支付按钮的前端处理(唯一不足之处是,没有后端处理,有时间我研究下)先放代码如何实现,再深研究一下逻辑。(按钮个数展示主要是这里设置)这里我只介绍用到的方法。
2024-01-22 17:40:06
1117
原创 Vue3+Ts:使用i18n实现国际化与全局动态下拉框框切换语言
Vue3+Ts:使用i18n实现国际化与全局动态下拉框框切换语言在 src 目录下新建 lang 文件夹,再创建3个ts文件,lang / index.ts , lang / en.ts , lang / zh.ts。这边我是在stores下创建了一个langConversion.ts文件。
2024-01-18 09:57:46
1191
原创 根据原对象数组中的某一个属性组成新数组
使用map和filter之前,一定要区分清楚,map只是把原有的数组转成新的格式的数组,数组长度不变,而filter是起到过滤作用,可以过滤数组中有些不符合条件的对象,数组长度会发生改变。方法三: 提取新的键值对对象数组。
2024-01-17 16:42:01
1408
原创 Vue3 父组件传值给子组件+以及使用NModal组件
我原本想await 调用getDetail() 会报错。`setup function returned a promise, but no boundary was found in the parent component tree. A component with async setup() must be nested in a in order to be rendered. `,想用await是数据还没请求完,表格列名又加载了(当时还没有使用`chi
2024-01-11 16:46:54
499
原创 vue3 require is not defined
vue3 require is not defined import.meta.url 是一个 ESM 的原生功能,会暴露当前模块的 URL。前言:我想在vue3项目的页面引入图片总是不成功,最后看到说是Vite在作祟,让我来瞧瞧,是怎么回事咧。那么就用不到require 了,去掉直接引入imgUrl使用。
2024-01-04 13:24:23
952
原创 Vue3+Ts项目——第三方认证登录
前言:我们得先去注册成为谷歌开发者,创建一个项目再获取id,整个难点就是获取ID。如何获取OAuth的客户端ID:链接。
2023-12-22 16:19:52
996
原创 Vue3+Ts项目——登录页面跳转到首页
根据我上篇所实现的左边菜单栏之后,需要登录成功跳转home页面。主要分为三步。不前排会报错`Cannot read properties of undefined (reading 'replace')`,也不要试图用useRouter()直接.replace会报错`inject() can only be used inside setup() or functional components.`等一些问题
2023-12-15 17:58:19
2232
原创 Vue3+Ts项目(Naive UI组件)——创建有图标可伸缩的左边菜单栏
我主要是总结另一位博主的创建过程,就是他标题取的,感觉有被白嫖到(手摸手创建…),哈哈哈哈哈哈,后面会附上原博主地址。以及我个人的总结理解。在 src 目录下,新建 router 文件夹,用于存放路由配置文件。后面都请无脑复制,因为我已经把原博主的过程都走了一遍。在 src 目录下,新建 views 目录,用于存放页面文件()页面会因为找不到一些依赖和文件而报红,咱先不管,后面再处理。个人理解vicons是个图标库,你想使用谁的图标引入谁的。我这边是简单处理:创建了一个css文件。,我还需要再研究研究。
2023-12-14 14:06:59
1958
原创 jsencrypt加密解密Ts使用方法+示例
jsencrypt加密解密Ts使用方法+示例 顺便处理分段加密长文本处理,也可以用[encryptlong](https://www.npmjs.com/package/encryptlong)点击进入详细介绍=>([基于 jsencrypt 扩展长文本分段加解密功能](https://www.npmjs.com/package/encryptlong))依赖来处理加解密。我目前前端只需处理加密,下面展示的解密方法在不超过长度情况下是没问题的,超过长度解密会返回null,后期可能会优化解密方法。
2023-12-11 13:34:46
815
原创 搭建一个Vue3+Ts项目
Vite+Vue3+Ts+sass+Router+pinia+axios,Cannot find module 'vue'. Did you mean to set the 'moduleResolution' option to 'node', or to add aliases to the 'paths' option?
2023-12-08 13:25:17
443
原创 vue3+ts使用setInterval、setTimeout方法
vue3+ts使用setInterval、setTimeout方法,如果是下面这种写法,会报错`Type 'Timeout' is not assignable to type 'number'`
2023-12-08 09:47:10
1532
原创 NaiveUI使用Message组件遇到的问题记录
最近刚入手vue3+ts,使用的是NaiveUI组件库,按照文档里显示引入,还要在app.vue加入标签,运行后还是会报错。`Error: [naive/use-dialog]: No outer founded.`在路径跳转前需要message提示,再跳转路由,结果:message不提示直接跳转页面问题,位置放的不对会报错`inject() can only be used inside setup() or functional,解决message不提示直接跳
2023-12-07 17:57:46
2443
1
原创 AntV G6自定义流程图Graph
前言:自定义流程图节点样式、节点可拖动,节点文字过长省略,文字过长的节点悬浮展示tooltip插件悬浮框,修改tooltip悬浮框样式。Dagre 流程图调用组件传值给mapData,这里只是自己演示设置了假数据a四、这里提供了直接改官方示例数据,简单的参考在官方图表示例找到Dagre 流程图
2023-07-14 14:49:30
2947
原创 VUE用elementUI实现无限滚动组件(InfiniteScroll)
前言:一个页面引入无限滚动组件,把InfiniteScroll写成组件使用。这里只说明核心部分。InfiniteScroll组件:包含了样式"**加载中**"、"**没有更多数据**"、"**暂无数据**"样式
2023-06-06 17:22:02
1829
原创 滚动条自动滚动显示倒计时
滚动条自动滚动显示倒计时一、css实现:先来个基础的不考虑文字内容长度等一些因素,只要内容往上动起来依据上面我们已经实现了文本内容上移,有些bug,文字内容上移后,停止自动滚动,鼠标滚动回不到最开始的文本头,还有就是文本内容没有超出页面高度,应不滚动。滚动一次之后应停止二、在我的探索下,发现了一个HTML标签marquee这个标签也没有实现我上面所提出的bug(marquee标签可以通过behavior控制滚动次数实现除外(但是还没滚动到底就 停止了)),还有就是marquee标签已经被淘汰了,一些
2023-05-16 12:01:07
303
原创 夜间模式qrcodejs2生成二维码设置白色边框(深色模式)
夜间模式qrcodejs2生成二维码设置白色边框(深色模式),找了好多qrcodejs2设置边框的方法都只适用于亮色情况下,一旦app浏览器自定义的深色模式,黑色二维码跟黑色背景融为一体无法识别。二维码边框设置
2023-04-26 16:50:23
1524
原创 MongoDB查询语句
字段是什么类型,那么查询时字段值的类型就应该是什么类型,比如如果字段类型是 NumberLog,那么查询时就应该执行查询类型为 NumberLog,如db.userInfo.find({id: NumberLog(10)}){ “_id” : ObjectId(“5cf7b4839ad87fde6fd23a03”), “title” : “MongoDB 介绍” }{ “title” : “MongoDB 介绍” }{ “title” : “MongoDB 概述” }假设集合qikegu有以下数据。
2023-04-25 15:47:49
686
原创 AntV G6自定义树状图TreeGraph
只是为了记录下自己写的G6组件成果G6去除生成图的动画效果animateG6拓扑图刷新页面按钮事件(刷新按钮根据页面变化展示不同的图片)以下这段代码结合下面,标题“还有各种鼠标事件(G6拓扑图缩放事件等)”里的,根据数据创建树状图节createNode () 方法里的页面缩放操作,可以官方文档搜viewportchange属性了解页面事件
2023-02-22 15:47:28
3227
4
原创 elementui自定义进度条形状
进度条多以圆形、直线以及仪表盘形来展示,难免会有ui出奇怪的样式,想要不一样的形状。组件自带没有自定义形状。如图,改变进度条形状重点就是在svg里的数据,第一个path是进度条的背景,第二个path是走进度的进度条。我们想要改进度条形状就是把path里的d改掉具体标签有2.其他svg标签转换成path直接上能转换的链接https://www.zhangxinxu.com/sp/path.html个人觉得研究其他标签要比研究path简单点,网上也能找到很多形状 (下面是网上找到的五角星)转换完是M10
2022-06-23 10:04:14
2418
原创 Electron使用
首先是官网走一波- -快速入门我根据官网的操作,其实都没啥毛病,然后打包用的 Electron Forge有点小问题,路径千万不要有中文,不然会很惨,像这样.因为有中文路径,我description和author都填了,还是抱这个错.(现在新生成的跟官网有一点不一样,自动生成的是index.js,description+author为空.打包他两不能为空)后面都解决了,但是觉得这个打包方式不太好(就是很流氓安装了都不告诉你,第一次打开就是安装).换了Electron builder(然后发现其实这个好像
2021-07-29 14:21:48
3140
原创 Element message同时出现多个提示框
/* message在同一位置弹出 *//* reset elementUI message */.el-message { top: 20px !important;}.el-message:not(:last-child) { visibility: hidden;}一开始想的很复杂,想着怎么拦截他的提示,让只出现一条弹框提示。后面就百度到了这个简单粗暴的方法。果然适合我。...
2021-07-15 18:12:43
806
原创 HTML背景图片轮播(div)
HTML: <div :style="backgroundUrl===''?'这里可以添加默认背景地址':backgroundUrl">记得加上长度和宽度样式,不然背景图不显示(如果相对于有外层div请根据样式自我调接) </div>方法: mounted () { this.currentUrl() }, methods: { currentUrl () { //每三秒更换一次背景图地址 setInterval(th
2021-05-07 09:47:03
7038
1
原创 swiper插件+vue实现图片轮播还有碰到的坑
今天踩了个大坑,就没碰到这么坑的,官方文档最坑。(官方文档没说版本差异,所以跟着版本操作会找不到文件而运行报错)第一步安装vue-awesome-swiper和swiper(官方文档只需要swiper)(vue-awesome-swiper是针对vue+swiper的封装插件)相对应的版本如下: "vue": "^2.5.2", "swiper": "^5.4.5", "vue-awesome-swiper": "^4.1.1",命令***(这个命令我没试过,因为我已经走了很多弯路,直
2021-04-25 15:33:21
313
原创 var、let、const之间的差异
接下来开始稍微深一点的挖掘,我经常声明属性的时候(不知道前端这么说专不专业"声明属性"),都是瞎声明一通不报错能用就行,要是报错就写成全局变量用this.出来用。哈哈啊哈哈哈啊哈哈哈啊哈哈哈var、let、const之间的差异varletconstvar支持全局,函数作用域接受重复声明变量预分析ES5中作用域有:全局作用域、函数作用域。没有块作用域的概念//作用域var aa=1;function fn(){ var aa=10; console.log(aa);}fn()
2021-04-21 10:11:43
73
原创 Koa与Express的区别
一个Java转前端的自白,以前就是会用没有深究,今天才大概分清Koa与Express的区别,哈哈哈哈。Koa和Express都是NodeJS的主流应用开发框架。Express是一个完整的nodejs应用框架。Koa是由Express团队开发的,但是它有不同的关注点。Koa致力于核心中间件功能。nodejs中间件是访问请求对象(req)和响应对象(res)的例程。这些例程在路由处理程序之前被调用,因此它们位于客户端与生成响应的路由逻辑的“中间”。nodejs应用程序可以将中间件例程“链接”到
2021-04-20 09:32:56
2560
原创 BigDecimal工具类
示例一:System.out.println(0.05 + 0.01);System.out.println(1.0 - 0.42);System.out.println(4.015 * 100);System.out.println(123.3 / 100);输出:0.0600000000000000050.5800000000000001401.499999999999941.2329999999999999Java中float的精度为6-7位有效数字。double的精度为15-
2021-03-08 13:53:49
112
原创 JAVA获取当前时间并作比较
方法一:通过Util包中的Date获取import java.util.Date;import java.text.SimpleDateFormat;public class CurrentDate{ public static void main(String[] args) { SimpleDateFormat simpleDateFormat = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss"); Syst
2021-03-05 15:09:41
6144
5
原创 Vue+VeeValidate使用和遇到的坑——vue表单验证插件
每次写博客都觉得自己话多,我第一次用VeeValidate,首先打开百度…发现好多安装VeeValidate没有说注意安装的版本,安装插件cnpm install vee-validate#2.0.0-beta.13 --save我一开始用npm install vee-validate@next --save下载的是4的版本,找不到如下图已经下载4的版本,请先删掉cnpm uninstall vee-validate,或许是我项目的问题删了之后会报一个找不到node-sass,安装cnpm
2021-02-02 20:14:20
2328
原创 Docker使用
Docker使用查看内核版本#如果低于3.1是不能进行安装的uname -r卸载docker$ sudo yum remove docker docker-common docker-selinux docker-engine#或者$ sudo yum remove docker \ docker-client \ docker-client-latest \ docker-co
2020-08-13 15:41:13
117
原创 Git 如何配置公钥
git 如何配置公钥一、配置git环境安装完客户端后,需要完成以下的配置:1. 配置用户名git config --global user.name "id"2. 配置邮箱git config --global user.email "注册邮箱"3. 查看配置git config --list4. 最后检查user.name及user.email是否配置正确:git config -ll二、添加SSH公钥1. 首先检查本机公钥:$ cd ~/.ssh如果提示:No su
2020-07-15 12:41:57
6231
原创 如何使用Git
Git从入门到精通Git简介Git是一个开源的分布式版本控制系统,用以有效、高速的处理从很小到非常大的项目版本管理。Git的特点分支更快、更容易。支持离线工作;本地提交可以稍后提交到服务器上。Git 提交都是原子的,且是整个项目范围的,而不像CVS 中一样是对每个文件的。Git 中的每个工作树都包含一个具有完整项目历史的仓库。没有哪一个 Git 仓库会天生比其他仓库更重要。Git 是用于 Linux内核开发的版本控制工具。与常用的版本控制工具 CVS, Subversion 等不同
2020-07-14 16:34:39
164
原创 jQuery选择器
jQuery选择器前言jQuery选择器的类型一、通过CSS选择器选取元素1,基本选择器2,层次选择器3,属性选择器二、通过条件过滤选取元素1,基本过滤选择器2,可见性过滤选择器jQuery选择器的注意事项问题前言这里应该是介绍jQuery选择器以及jQuery选择器的优点,但是我觉得这是我的第一篇博客,需要有些许不同。作为一个后端Java…第一篇写jQuery也是出于方便自己吧。我的笔记都是手写的,保存性不高,内容也很杂乱。近期想整理上来。jQuery选择器的类型一、通过CSS选择器选取元素1,
2020-06-15 12:12:48
109
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人