- 博客(43)
- 收藏
- 关注
原创 【echarts区域地图】
背景:我们在制作大屏的时候,经常会使用到echarts制作各种图表,饼图,柱状图,折线图。有时候也会用到地图的交互,使大屏效果看起来更加高级。首先是需要我们待绘制地图的json。这里我们以成都新都区为例。我们要完成上面的效果需要准备什么呢?接下来就是开始渲染地图了。
2024-07-22 10:39:48
224
原创 常用接口避免频繁请求
在项目开发过程中我们难免会遇到一些通用的接口,需要在多个页面调用,拿去结果。比如我们常用的字典接口,后端通过字典配置一些数据,通常这些字典数据是不常更改的。我们通过字典接口传递不同的参数过去,获取到接口,但是往往我们会在多个页面需要获取到某一个字典的数据,这时候如果每次需要获取到字典数据的时候就重新发一个请求,会导致我们发一些无意义的请求。此时我们会有什么优化想法呢?
2024-07-09 11:54:56
180
原创 UI还原度小技巧之缩放
我们经常会遇到UI给的设计图尺寸较大,和我们浏览器相差太大,这时候,按照UI给的尺寸直接写进代码里面的话,可能会让页面结构在我们的浏览器上面显得很大,产生横向滚动条等,明明是按照设计稿的尺寸,怎么做出来感觉和设计稿两模两样。我们可以考虑试试想一下,将设计稿全铺满浏览器的想法,这要求我们设计稿根据我们的浏览器大小而跟随变化。我们主要考虑宽的适配。按照这样的适配方式,那我们做出来的页面就是比较符合设计稿在浏览器的展示效果。只需要在页面外层的元素上添加这个样式,就可以完成缩放啦。
2024-07-05 10:28:01
232
原创 动态表单的实现和校验
在用户下单过程中,需要填写用户信息,包括:姓名,手机号,身份证号,邮箱等。后端配置的内容包含输入框标题text和输入框的key,用户个数可以添加,新增的用户同样满足后端配置的填写表单要求。我们面对这个需求,可以想到的是首先把表单写成固定的表单,然后根据后端配置进行判断展示,但是这样对于后端配置的text和key就不能很好适配。现在还有一个问题就是在于表单内容类型,包含普通输入框text,数字输入框number,身份证号输入框idcard带图片识别身份证号功能。提交表单的时候还需要对配置的表单内容进行校验。
2024-04-09 17:30:48
382
原创 前端saas化部署
在项目中难免会遇到一些特殊的需求,例如同一套代码需要同时部署上两个不同的域名A和B。A和B的不同之处仅在于,例如一些背景图片,logo,展示模块的不同,其他业务逻辑是和展示模块是完全一样的。此时我们当然可以考虑单独将代码复制一份出来,单独部署域名B,但是此时的维护成本就会增加。保存需要更新的内容缓存信息,此处选择的是通过localStorage和vuex一起存储。域名A和域名B展示的内容区别有,接口访问域名,logo图片,背景图片。通过请求用户配置信息接口获取不同域名下的配置信息,并保存起来。
2024-04-08 10:20:49
508
原创 小游戏制作QQ宠物系列 ----躲避老鼠
点击鼠标左键,控制左侧人物跳跃躲避右侧老鼠的撞击,成功躲避老鼠的撞击则积分+1;老鼠的速度是随机的。本文章是小游戏制作系列,小游戏制作QQ宠物系列 ----躲避老鼠。js代码重点方法(未优化版)
2023-07-05 09:32:00
219
原创 小游戏制作目录
文章目录防QQ宠物小游戏系列吹泡泡下18层跳绳躲避老鼠模仿动作防电脑小游戏系列纸牌扫雷其他系列五子棋魔方还原连连看防QQ宠物小游戏系列吹泡泡下18层跳绳躲避老鼠模仿动作防电脑小游戏系列纸牌扫雷其他系列五子棋魔方还原连连看...
2022-05-20 11:50:41
359
原创 【业务组件】占位图片页面,适用于移动端
背景由于在移动端,很多时候存在断网,弱网的访问情况,在这种情况下,接口无返回,页面无法直接刷新。此时就需要当这种情况下,展示统一的占位图片页面以及刷新操作。效果代码实现组件html代码部分<div :style="{ height:'100vh', padding: '0px 0 0', boxSizing: 'border-box', background: '#fff;', }" v-show="disconnect
2022-05-19 16:23:23
347
原创 前端项目开发过程中遇到的问题若干
开发过程中遇到的问题若干字符串 原代码 ruleForm.customerPhone = data.externalPhone.split(',')[0] ruleForm.phoneArray = data.relation.filter((item, index) => { item.isReadonly = true return item.contactRlatName === '本人' && index >
2022-05-06 20:29:02
382
原创 【业务组件】表格分页组件
文章目录背景描述组件构思组件结构组件优化背景描述项目组开发的后台管理系统,虽然公司有推出一些公用组件,但是这些组件不能满足一些业务上的使用场景,而当时公司的架构部门忙得不能处理我们业务组件的需求,所以,整合了当前项目的业务需求,开发了一套试用于当前项目的搜索组件,后续也陆陆续续被其他项目组使用,不过也是后话了。组件构思组件结构–images 里面存放的是列表无数据占位图组件优化...
2022-04-02 15:07:01
1349
原创 搭建一个qiankun的微前端应用【未完】
搭建一个qiankun的微前端应用使用qiankun准备主应用的vue项目安装qiankun准备一个vue的微应用微应用导出生命周期新增core文件夹,在core目录下新增public-path.js修改入口main.js文件使用qiankun你好! 开始之前可以先看看官网信息qiankun。准备主应用的vue项目安装qiankun按照官网的快速上手内容进行主应用的安装。1,安装qiankun2,在主应用中注册微应用准备一个vue的微应用微应用导出生命周期新增core文件夹,在cor
2022-01-11 17:34:04
327
原创 vue前端代码风格开发规范
文章目录文件夹命名变量命名类名,id命名方式方法命名文件夹命名components中的组件文件夹使用PascalCase命名, 组件文件名也是为PascalCase 格式(index.js和index.vue除外)其他文件夹以kebab-case方式命名其他文件命名方式以kebab-case方式命名变量命名常量命名规范为KEBAB_CASE类名,id命名方式css命名参考BEM命名规范,BEM的意思就是块(block)、元素(element)、修饰符(modifier),是由Yandex团队
2021-11-11 17:20:03
957
原创 全局指令-element-ui 下拉框无限下拉实现
准备好一个全局指令import Vue from 'vue';let MyPlugin = {};// 定义全局指令export default MyPlugin.install = function (vue, options) {// loadmore 是定义的指令 名称 , 使用时 用 v-loadmore = "dosomethingFun or data" Vue.directive('loadmore', { // bind只调用一次,指令第一次绑定到元素时调用。在这里可以进行一次
2021-08-31 18:28:22
811
原创 原生js的下载文件方法 2021-08-31
原生js的下载文件方法下载方法异常处理时下载方法/** * 下载文件 * * 原方法 downloadHandler(url, fileName) by zhaojianmei * 因为新需求的下载是post请求,但是重复写的代码和原有的代码重复度太高,不同的地方只有两处,所以考虑直接在原方法上改写,如果有问题,可以再退回之前的方法。现在只是觉得代码重复量太大了。 * @param {url} 必要参数,请求的url * @param {fileName} 必要参数,下载的文件名 * @p
2021-08-31 16:48:01
694
原创 记录一个element el-select filterable回显问题
在项目中,遇到一个开发场景,可搜索下拉框里面需要默认选中第一条下拉框数据。但是在测试的时候,发现下拉数据还没请求回来的时候,点击搜索输入框,等待下拉数据请求回来之后,输入框里面显示的是对应的id而非label的值。处理这个问题,可以在接口请求成功之前组织用户点击输入框。用loading或者使用disabled属性。...
2020-09-27 23:29:37
1335
原创 整理常用的git指令
整理常用的git指令拉代码直接clone master分支的代码git clone <项目仓的地址>当需要clone 指定分支代码时git clone -b <指定分支> <项目仓的地址>提交git statusgit add .git commit -m"提交内容"git pull --rebasegit push 或者 git push origin <分支>tag查看taggit tag 冲突...
2020-07-09 11:30:15
722
1
原创 js 中 !! 的判断
!!的判断我们在处理数据判断的时候,常会遇到判断"",null,undefined 的情况。如果这三种情况同时存在,大家想到的是一个一个判断吗,然后再 || 起来。这样写的代码感觉并不太厉害的亚子。偶然发现,!对于这三种情况都会返回一个false的情况。我们对于可能出现这三种情况的数据。可以使用!!来判断。var a = "";if(!!a){//code 当a有值的时候运行代码}记...
2020-04-02 14:19:13
1441
原创 关于js下载.xls格式的时候处理后端的异常报错信息
关于js下载.xls格式的时候处理后端的异常报错信息在项目中我们遇到了一个下载表格为.xls的需求。下载方法其他同事已经写好了。能下载的时候后端传递的是二进制文件流,但是后端报错的时候后端传递的值就是json格式。现在我们responseType为blob。意味着不管后端现在是否传的报错信息,我们接收到的格式都是blob。现在为了能够区分报错信息,就需要对blob信息进行解析。经查询可得知,...
2020-04-01 16:48:21
538
转载 vue调试工具 vue-devtools的安装
关于vue-devtools的安装参考文章 Vue调试神器vue-devtools安装文中介绍了两种方法用于安装vue,由于使用git真的是太慢了,所以选择了作者推荐的第二种方法,在百度网盘中下载压缩包直接进行安装...
2020-03-20 14:29:37
97
原创 cmd 日常 常用指令
cmd常用指令返回上一级访问某一个目录创建文件夹创建文件访问文件目录在目录下拷贝文件返回上一级cd ../访问某一个目录cd [目录地址]创建文件夹md 文件夹创建文件cd.>【文件名】访问文件目录dir在目录下拷贝文件copy [文件路径]注意:文件路径里面的/需要改成\...
2019-12-27 17:22:14
184
原创 js的typeof和instanceof
typeof 主要是用于判断参数是什么类型,返回一个字符串,通常是下面几个结果:“number”,“string”,“boolean”,“object”,“function”,“undefined”我们可以由下面这张表看出typeof用于判断“boolean”,“number”,“string”,"function"这几个类型的时候是比较精准的,但是在其他两个判断下就会出现一些误差。所以我们在...
2019-11-25 15:26:26
121
原创 在使用vue过程中遇到的一些有些奇怪的问题
vue遇到的奇怪问题明明定义了的数据,为什么获取的时候报错在使用vue的过程中,由于自己是个新手,都是一边摸索一边做项目,难免遇到些奇怪的问题,此贴用于保留自己遇到的奇怪的问题和解决方案。明明定义了的数据,为什么获取的时候报错首先我们来看此报错信息:按照这个报错信息来理解,是我的一个’length’属性未定义。看一下我本地json是怎么写的。可以清晰明了的看到我的length是已经写...
2019-09-23 15:29:14
544
原创 前端菜鸟查漏补缺--node.js篇(上篇)
关于node.js。我再前面项目中使用webpack搭建项目的时候有了解过。当时单纯只是说配置webpack和vue的时候需要。而没有真正的把它作为一个新的知识点来学习。其实现在node.js对于前端来说还是蛮重要的,还是要慢慢学习啊。...
2019-09-06 15:08:21
246
原创 js日常写点东西-2
现在想用js写一些小游戏比如:扫雷,迷宫,纸牌游戏。以前qq宠物里面的一些游戏(戳泡泡,下十八层,跳绳之类的)。后续更新吧,虽然很懒,但是也要有进步才好呀...
2019-09-06 14:57:46
116
原创 js的日常写点东西-1
关于js的逻辑和算法,对于我来说一直是一个比较薄弱的板块。希望多练习能够得到提升。下面练习输出一个菱形◇的*;首先我们观察这个输出的结构,当总排数是5的时候,每一排的*个数为,1,3,5,3,1我们可以先以固定的5排来写,写完之后再进行代码的扩展。var total=5;var len =1;for(var i=0;i<=5;i++){ if(i<3){ len=1...
2019-09-05 11:19:02
107
原创 前端菜鸟查漏补缺--js篇
出来工作已经两三年了,呆过的公司都是小型企业,在跳槽之前都觉得自己技术很厉害了,但是在经过面试之后才知道自己差很多东西。就算说是前端最基础的html+css+js,自以为掌握得很不错了,其实还差得很远。就单js来说,由于自己缺乏对js底层技术的思考,所以一直不知道js的原型链。以为自己技术已经可以了,其实差得很远。这篇文章主要就是用于我在遇到自己不熟悉的js部分的一个记录,希望自己的技术越来越好吧...
2019-09-04 10:24:55
139
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人