- 博客(68)
- 收藏
- 关注
RSS订阅原创 关于后端返回的数据里面含有null，展示需要进行替换为-或者其他时，来个一劳永逸的办法，关键词map reduce
/ Array.reduce接收一个函数作为累加器,把更改过的数据拼接起来获得新数组。// 收集起来的每一项是一个json集合 不是arr 所以需要push。// res.data.records 这是拿到的数组数据的集合。// 收集每个item 的keys集合进行遍历，// 每一项key值 有值则保留无值则替换。
2023-02-27 14:23:51
579
1
原创 关于用windows开发遇到的各种乌龙事件之node版本管理---nvm install node之后 npm 找不到的问题
nvm install node npm找不到
2023-02-24 12:25:17
2262
原创 tinymce编辑器之placeholder插件的实现
由于业务需要，产品希望编辑器的输入框也和input框一样有placeholder的提示，但是编辑器本身是没有这个功能的，所以我们要实现该业务，需要写个插件来实现。
2022-11-22 14:49:50
1728
4
原创 记录一下和组织架构树死磕的不知道第几天——基于antd-vue1.x版本实现钉钉选择人和部门的另一种组织架构树
肯定是通过面包屑回去啊，所面包屑给一个click事件，因为面包屑的出现肯定是我们知道的，返回的时候根据id请求当前项的下级组织架构就可以显示了，但是我做了预缓存，所以我直接拿预缓存数据就可以了。同理，上述提到的选中和全选一样的，不管我操作到什么地步了，我希望我在某一个组织架构的下级选中的数据当我点到这一级的时候会回显出来让我知道，包括我查询出来的数据，不然别人会误以为是bug，所以这个必须要做预缓存。基础架子搭好了，开始实现业务代码，首先肯定是查询出组织架构的数据来，接口请求么，直接请求查询顶级菜单。
2022-10-13 10:27:59
2093
14
原创 基于antd-vue v1.7.x版本所开发的组织架构树升级版，支持增删改查，滑动加载、远程搜索
背景：在此之前已经实现过单层级的增删改查，现在需求升级成希望无限往下加 ，所以又来更新一下，首先肯定是要针对组织架构树进行二次封装 具体方法可以看首先看效果图。
2022-08-16 14:30:24
743
5
原创 关于echarts图标 label文字过长需要显示...
xAxis: [{ type: 'category', axisTick: { alignWithLabel: true }, axisLabel: { with: 50, interval: 0, //横轴信息全部显示 // rotate:-15,//-15度角倾斜显示, fontSize: 10, //关键是这句
2022-02-21 15:43:20
1117
原创 关于echarts实现地图并显示各省份名称及不同块显示不同原因，最后循环播放tooltip信息
最近接到这个需求，要把一些数据展示在地图上，并且能够自动播放，毕竟这是个大屏数据的项目，话不多少，直接上代码首先是要实现一个地图，显示每个省份的名字，首先准备要渲染的数据，根据你自己要求，接口返回的也可以var mapData = [{ id: 1, name: '北京', value: 30 }, { id: 2, name: '广东', value: 29 }, .
2022-02-21 11:32:53
13592
5
原创 jquery 动态获取本地时间
// 动态获取本地时间 setInterval(function getCurrentDate() { var date = new Date() var y = date.getFullYear(); var m = date.getMonth() + 1; var d = date.getDate(); var h = date.getHours(); var min = date.getMinutes(); var s = date.getS
2022-02-18 10:46:03
684
原创 vue3从0开始实战——基础知识点
首先贴一下vue3 官网的地址 https://v3.cn.vuejs.org/guide/introduction.html#vue-js-%E6%98%AF%E4%BB%80%E4%B9%88写过vue2项目的都知道我们是如何写代码，但是可能很多人第一次用vue3开发的时候难免会一头雾水，想着要怎么写呢？其实在vue3里面用vue2的写法也是可以的，不过就是会报很多警告，项目还是可以运行的，不过不建议这么干，不然规范就毫无意义了。上一篇我们创建了一个新项目，然后我们会发现里面的写法其实和我们vu
2022-02-14 17:43:48
1263
原创 vue3项目实战从0开始
安装首先查看一下你当前npm的版本，vue3的版本需要大于3.0，建议安装最新的npm查看版本 `npm -v` 升级或安装cnpmnpm install cnpm -g`升级npm `cnpm install npm -g`cnpm 能很好地和 Webpack 或 Browserify 模块打包器配合使用，所以推荐 使用cnpm，所以我们需要安装一下淘宝镜像 `npm install -g cnpm --registry=https://registry.npm.taobao.
2022-01-27 15:36:08
3386
原创 关于VueJsonPretty美化返回数据
先上效果图最近有个小demo，做一个规则生产的项目，需求方希望返回的jscon数据可以这么展示，于是使用了这这个插件首先安装npm下载$ npm install vue-json-pretty --saveyarn下载$ yarn add vue-json-pretty引入（在需要使用这个插件的文件里面引入就可以了）import VueJsonPretty from "vue-json-pretty";import "vue-json-pretty/lib/styles.css"
2022-01-24 17:12:46
2001
原创 说一说实战项目升级从vue2到vue3 之router
先附上vue-router 官方文档访问地址https://router.vuejs.org/zh/router.jsvue2 写法：import Vue from 'vue'import VueRouter from 'vue-router'import Layout from '../layout'import modules from './modules/require'Vue.use(VueRouter)const routes = [{ redirect: '/',
2022-01-24 16:36:19
1324
原创 说一说实战项目升级从vue2到vue3 之main.js 区别
相信很多人都对尤大口中的vue3蠢蠢欲动许久了，但是很多人就是一头雾水没法下手，不知道改怎么搞，或者怕项目升级报错什么的。我自己的成功的把项目进行升级了，所以想简单记录一下。简而言之首先就是版本嘛vue3 vue-cli 4.x.x vue-router 4.x.x vuex 4.x.x总体来说vue3的相关配置什么的和vue2没啥区别 就升级一下版本几乎就兼容vue3了，包括config的配置、webpack配置等等。其实很多人最主要的是想知道项目怎么
2022-01-21 14:26:37
1242
原创 vue3配置main.js 和 vue2 main.js配置的对比
vue2 main.js的配置import Vue from 'vue'import http from 'axios'import App from './App.vue'import router from './router'import Antd from '.ant-design-vue'import VueCookies from 'vue-cookies'//使用Vue.use(Antd)Vue.use(draggable)Vue.component('vue-drag
2022-01-11 16:54:29
1649
原创 关于搭建vue框架 npn run serve后会遇到的一些问题
1、格式问题该问题解决方法为 该项目下运行此行命令便可解决 npm run lint --fix
2022-01-11 13:57:05
371
原创 关于bash创建项目不能通过键盘选项的问题
从工作开始就习惯使用命令行，安装，卸载，提交代码，合并代码…能用命令行解决的基本都喜欢用命令行。刚知道要做一个小demo 过年前完成用vue3，所以便用bash创建一个vue项目vue create demo 回车自定义选项完成之后npm run serve之后发现，代码似乎不大对仔细一看还是用的vue2的写法，于是看了一下package.json文件，vue的版本还是2.x.x，回头去看才发现刚才创建项目并没有选到vue3但是直接使用上述命令是不能自己任意选择的，所以换个命令替换它`win
2022-01-10 14:14:48
199
原创 记录一下开发邮件模板兼容outlook客户端以及其他主流邮箱客户端所引发的无数问题，头发要薅没了
最近整了一个钓鱼网站，然后会发送模板邮件，模板内容如下等等诸如此类的样式布局，这个直接用原生的html+css写的模板内容，发送邮件之后在邮箱里面显示的很正常，结果出现了一个outlook邮箱。这个东西觉得是我继兼容ie浏览器之后最恶心的软件，兼容它堪比十个ie 恶心的一批~因为它的显示会是这样这样这样网易邮箱outlook就这些问题？想多了，我实在懒得记录了，全是问题，头发都薅完了。总结一下这种邮件模板自荐邮箱发布邮件的时候各个邮箱客户端或者网页版会出现的问题。
2022-01-07 15:20:16
1804
5
原创 关于vue引入echarts实现双柱柱状图嵌套
今天想说一下这个怎么实现，还是那句话，只有你想不到，没有产品不敢想的，先上效果图。一个部门对应的数据是双柱的~应产品需求，得实现~定一个div 并且设置一个id <div class="department-graph" id="departmentTotalGraph"></div>在这个页面组件里面引入 import * as echarts from 'echarts';把我们要实现的图标的option抽出来单独写成了一个js文件 然后引入 import {Op
2022-01-04 16:42:10
1598
2
原创 echarts 柱状图堆叠加折线统计率展示
看效果图export const overallDrillOption = { tooltip: { trigger: 'axis', axisPointer: { type: 'shadow' }, formatter: function (params) { return ` ${params[0].name}<br> <div style="margin-top:10px;">${p
2022-01-04 16:18:55
804
原创 基于antd-vue封装的下拉选择框滑动加载并且带搜索还可以新增的功能
还是那句话，只有你想不到的，没有产品不敢想的。这个也无需求也是emmmmm头一回接。那就是下拉框数据很多的时候不想要一次性查出来，想要滑动加载，那第一反应很简单咯，分页查询嘛<a-select v-decorator="[ 'organizationId', { initialValue: showData.organizationName,
2021-12-14 14:45:07
3619
10
原创 基于antd-vue二次封装成自己想要的业务——加强篇
之前写过这个，有地址https://blog.csdn.net/weixin_44191425/article/details/119740500?spm=1001.2014.3001.5501现在只是为了更优化丰富一下，然后修复了一些bug结合之前的和现在的看，会更明白。基于之前封装的组件，优化了一些bug，比如说编辑和新增的时候做了其他操作，新增的输入框和编辑框要恢复到之前的状态。<template> <div> <a-tree v-if=
2021-12-14 14:07:20
1820
5
原创 关于antd-vue 日期组件手动关闭弹出框的问题
由于产品的需求，有一个日期筛选的条件，如图所示框架选用的是ant-vue，选择了其中range的插件<a-range-pickerstyle="width: 214px":value="searchTime":placeholder="['开始月份', '结束月份']"format="YYYY-MM":mode="modelType"@panelChange="handleChange"@change="clearValue"><a-icon slot="suffi
2021-12-14 13:48:30
3681
9
原创 vue axios 关于request请求封装
一般这种情况都是根据自己的喜好怎么写都行首先肯定是npm install axios在项目里创建一个文件request.js文件首先引入vue和axiosimport Vue from "vue";import axios from 'axios'// 创建axios实例const instance = axios.create({ timeout: 1000 * 60 * 5 //设置超时时间，超时之后请求便会cancel});获取接口请求地址const baseURL =
2021-12-09 17:46:27
1643
原创 vue项目禁止浏览器回退按钮
在main.js里面添加如下代码// 禁用浏览器回退键window.addEventListener('popstate', function() { history.pushState(null, null, document.URL)})
2021-12-09 17:10:32
973
原创 基于antd-vue图片组件封装优化
<template> <div class="clearfix"> <a-upload list-type="picture-card" :file-list="fileList" :headers="headers" @preview="handlePreview" :custom-request="customRequestFunction" :before-upload="beforeUp
2021-12-09 17:05:42
1015
原创 基于antd-vue的简易穿梭框
<template> <div> <a-modal :visible="true" title="选择部门" @cancel="closeModal" width="560px" > <div class="gutter-example"> <a-row :gutter="16"> <a-col class="gutter-ro
2021-11-24 10:45:46
985
原创 tinymce编辑器踩坑之旅-----------自定义编辑器的按钮功能
多年开发经验至今发现一个问题，产品所能想到的需求只有开发想不到的，没有产品不敢想的。之前没怎么使过tinymce这个编辑器，但是由于业务需要不得不用这款编辑器，从一开始看文档到各种实验然后改源码之后，我看见这个编辑器就想吐现在。言归正传，昨天产品提了一个功能，那便是想要在编辑器上面添加一个下拉框，选择下拉框里的数据之后给文档配置不同的参数。上个图先就上想加一个上述的下拉框，里面的数据是接口返回的，然后实现是下面的样子，在对应的地方配置参数后，根据业务需要，不同的人就能看见自己的名字和手机号，当然
2021-11-04 14:44:30
3432
3
原创 tinymce编辑器和vue集成的编辑器
记录一下富文本编辑器的一些问题一开始编辑器选用的是vue集成的编辑器，但是在页面抓取的时候发现不能显示table 的样式，所以选用了tinymce编辑器但是tinymce编辑器在钓鱼链接抓取之后，可能抓取的代码里面涉及到内联样式或者写在style里面的样式，包括link的一些样式，tinymce无法识别，导致样式乱掉所以在初始化的时候需要加上一个自定义标签显示的配置custom_elements:“style,html,head,body,title,meta”,//允许自定义标签存在因为产品需求
2021-11-04 11:43:50
120
原创 tinymce 编辑器踩坑之旅----------自定义插件
先贴个官网地址 https://www.tiny.cloud/docs/最近开发项目中产品有很多需求，比如说在编辑器里面html代码，本来一开始用的是vue集成的那个编辑器，然后就发现，不能显示table！！！！样式无奈之下找了找好像tinymce这个编辑器可以满足，但是在此之前没用过，所以去通读了一边官方网址，了解了一些基本东西。然后开干最开始么肯定是先安装一下插件npm install tinymce/tinymce-vue --savenpm install tinymce --s
2021-10-21 15:57:58
4178
原创 code editor踩坑
最近产品需求有需要编辑页面代码的，所以用到了一个编辑器 monaco-editor但是在使用的过程中 报了一个错误然后查了查问题，定位到报错位置 languageFeatures.js?6dbe:74仔细排查之后发现是没有配置插件相关的东西使用之前肯定是要先install一下的 npm install monaco-editor --save 局部安装一下这个插件安装好了之后还需要去配置vue.config.js 添加一下如下代码const MonacoWebpackPlugin
2021-10-20 17:10:50
755
原创 常见问题之vueRouter的重复跳转问题
今天项目中遇到了一个问题，当token失效之后要调回登录页，由于项目没有登录页，需要跳转回官网页面，所以出现了如下问题然后需要在router的文件里面添加上以下代码便可以解决这个问题const VueRouterPush = VueRouter.prototype.pushVueRouter.prototype.push = function push (to) { return VueRouterPush.call(this, to).catch(err => err)}...
2021-09-22 10:46:37
413
原创 node之模块系统
为了文件可以相互调用，node.js提供了模块系统。模块是Node.js 应用程序的基本组成部分，文件和模块是一一对应的。换言之，一个 Node.js 文件就是一个模块，这个文件可能是JavaScript 代码、JSON 或者编译过的C/C++ 扩展。具体用法在vue 项目里面太多了./为当前目录，node.js 默认后缀为 jsNode.js 提供了 exports 和 require 两个对象，其中 exports 是模块公开的接口，require 用于从外部获取一个模块的接口，即所获取模块的
2021-09-13 16:48:49
78
原创 关于下载pdf请求不到数据问题
最近有个项目需要下载excel和pdf文件，可是每次下载出来pdf都是空的，里面的数据不存在，但是接口请求的时候，数据是返回的。为了解决这个问题，所以进行了一番查证，最后得出两种处理方式1、在pdf引擎里面配置对应域名的Hosts2、前端api请求地址写成/api， 写成活的，依赖当前访问域名，然后修改前端的nginx，/api请求转发到fishing-server-svc:8080因为是内网开发，所以除了正是环境之外都需要配置host，而当我们请求pdf数据的时候因为host问题导致了数据没有拿到
2021-09-13 16:13:44
686
原创 vuex储值问题
每次开发vue项目的时候，尤其是sass平台或者管理平台，都会发现有大量数据需要本地存储的必要。然后很多时候我们请求接口其实一次就够，不用次次请求，于是就像办法把数据存储在本地。一般情况下，我们是可以通过sessionStorage，localStorage，cookie去存储值。localStorage没有时间期限，除非将它移除，sessionStorage即会话，当浏览器关闭时会话结束，有时间期限。之前，这些都是由cookie完成的，但是cookie不适合大量数据的存储，因为它们由每个对
2021-09-10 15:12:55
231
原创 vue-router 跳转 及 渲染 及安全问题
最近开发一个新项目，过安服测试的时候有一些低危的问题，但是觉得又有必要去给他解决。第一个问题则是，未登录情况下，通过改变地址栏问题能够访问到页面，暴露接口问题，虽然这个一开始就是产品设计考虑不周到，加上开发时间又十分紧迫，所以后期才来补一下这个安全问题。解决方法当然就是利用理由的beforeEach了。// 全局路由钩子router.beforeEach((to, from, next) => { const pathName = to.name // 判断该路由是否需要登录权限
2021-09-09 17:52:05
618
原创 vue-cli3多环境配置--更新
由于之前的配置发布到不同环境是根据不同的分支来部署的，所以部署的时候相关配置都在env.production里面进行配置的，如下图但是在实际的执行中存在很不便之处，比如说test分支主要针对测试环境进行部署，新的功能和迭代在develop分支上进行开发，开发完成后就需要merge到test分支去部署。meger的过程往往会导致test分支上的production配置被覆盖，等于每merge一次就需要手动去更改一次配置信息，才能保证代码部署成功，不报错。为了减少这样不必要的麻烦，所以配置了多个环境，如
2021-09-07 19:51:07
354
原创 vue-cli3 配置多坏境打包
多环境配置NODE_ENV = productionVUE_APP_URL = “http://192.168.0.101”配置axios请求基础api的ip地址 api.request.js不配置多环境 const baseUrl = process.env.NODE_ENV === ‘development’ ? config.baseUrl.dev : cconfig.baseUrl.pro配置多环境 const baseUrl = process.env.VUE_APP_UR
2021-09-07 17:56:32
242
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人