周家大小姐

原创 vue element 时间选择开始时间不能大于结束时间

html:el-date-picker选择器:picker-options="startTime":picker-options="endTime"为禁止选择逻辑 <div class="control-item"> <div class="left"> <span class="sale-require-star-text">起保日期</span> </div> ..

原创 vue 根据每个用户的自定义表格设置进行本地存储,当本地没有存储过请求接口

因为多个页面使用,所以写一个mixin文件JSON.parse(localStorage.getItem(`${userInfo.userCode}_theme_config`))userInfo.userCode可以对每个用户进行动态存储/** * 用户个性化配置 */export const personalThemeConfigMixin = { methods: { // 获取 getThemeConfigOfKey(key) { retu

原创 vue 定义axios默认路径前缀或动态修改前缀

如:每个请求url前都要加一个前缀,但会根据开发环境不同而变化,那么我们可以写一个方法去引用,方便后面维护.env.development开发文件中写入要用的服务编码# 微服务编码VUE_APP_SERVICE_PREFIX = '/0201040201'src/settings.js新建的settings文件中引入module.exports = { /** * 主站标题 * @type {string} */ title: '开发项目名称', /..

原创 vue directive全局自定义指定控制元素的显示和隐藏

创建src\directive\auth\index.js文件import store from '@/store'const auth= { inserted(el,binding,vnode,oldVnode){ let user = window.sessionStorage.getItem('user') user = user ? JSON.parse(user) : {} // 如果角色为管理员就不验证 if(!user.super){ let rules =

原创 vue pdf下载

<el-table-column label="保单号" show-overflow-tooltip min-width="220"> <template slot-scope="scope"> <span>{{ scope.row.policyNoCI }}</span> <span v-if="scope.row.policyNoCI" :key="sco..

原创 vue 封装路由(二次封装)

当开发中路由越来越多的情况下;我们如果每个name和path都需要自己手动去写的话就会浪费不少时间;下面封装一个自动生成的name和path的方法;并且对components中共有的内容也进行提取这样会方便很多router.jsimport Vue from 'vue'import Router from 'vue-router'//引入封装好的路由路径import routes ...

原创 vue 菜单路由重复点击报错NavigationDuplicated

NavigationDuplicated {_name: "NavigationDuplicated", name: "NavigationDuplicated", message: "Navigating to current location ("/produce/delivery-order") is not allowed", stack: "Error↵ at new Navi...

原创 vue2.0 结合elementui封装的一个请求

confing/dev.env.js'use strict'const merge = require('webpack-merge')const prodEnv = require('./prod.env')module.exports = merge(prodEnv, { NODE_ENV: '"development"', //BASE_API: '"http:/...

原创 vue 2.0 封装axios

新建一个utitls文件在文件中新建 一个http.jsimport axios from 'axios'var HttpRequest = { getRequest({ url, data = {}, method = "GET" }) { return new Promise((resolve, reject) => { thi...

原创 vue3+vite+ts安装wangeditor富文本编辑器

实现粘贴,上传图片时本地渲染但并不实现上传功能,工具栏移除不需要的工具。

原创 vue3+vite+ts使用wangEditor获取不到toolbarKeys问题TypeError: Cannot read properties of null (reading ‘getConf

【代码】vue3+vite+ts使用wangEditor获取不到toolbarKeys问题TypeError: Cannot read properties of null (reading 'getConf。

原创 linux安装nvm

bashrc文件及代码回车进入编辑界面。完成编辑后按下esc，再：wq回车。当前盘打开终端后的nvm文件夹中。输入pwd 确定当前文件完成路径。在编辑界面中输入i加入以下代码。如果树根不够就用加sudo。之后输入nvm -v。

原创 闭包理解图

原创 vue3 watch监听某个具体的属性变化

【代码】vue3 watch监听某个具体的属性变化。

原创 vue3+ts+vite axios封装请求并扩展入参

解决办法就是扩展 AxiosResponse接口参数在request.ts页面中加入。会发现handleResponse参并不在axios提供的类型中。api.ts文件进行接口请求。最后发现api也不报红了。

原创 vue3+ts+vite使用mock数据

接口使用(我这里是写的axios封装,你们根据自己当前需求)vite.config.ts文件配置。在根路径下创建mock文件夹。

原创 vue3+vite+ts配置多个代理并解决报404问题

之前配置接口代理总是报404,明明接口地址是对的但还是报是因数写法不对;用了vue2中的写法。其中的settings.ts文件可以不用封装直接写你的env就行;在vite.config.ts中配置poxy代理。.env.development文件内容。根路径下创建env文件根据自己需要名命。创建proxy.ts文件。api.ts接口使用。

原创 typescript中的Omit排除类型及Pick取想要的属性

【代码】typescript中的Omit排除类型及Pick取想要的属性。

原创 vue3+vite+ts 配置commit强制码提交规范配置 commitlint

文件配置根路径创建文件.husky文件创建 commit-msgpackage.json添加代码。

原创 vue3+ts+vite配置commit提交代码时语法检测

在 package.json 中配置lint-staged注：这里 lint-staged 的配置是：在 git 的待提交的文件中，在 src 目录下的所有都要执行的命令。

原创 json-server 模拟接口数据

在文件根路径创建文件夹 data/db.json。定义你想要的json内容。终端查看监听的json。

原创 axure RP9.0安装字体图标库fontawesome

复制后粘贴到axure面板,就可以了;你可看你选中的字体是否是font Awesom字体,之后可以对字体进行改变色及字体大小。在字体库中找看有没有font Awesome。这后进入图标官网点顶总菜单中的icons。进入后下载想要的版本如我是6.3。下载后得到压缩包,解压之后效果。双击开点你想要的 进行安装。安装后重启axure。

原创 vuecli3 批量打印二维码

【代码】vuecli3 批量打印二维码。

原创 qiankun 乾坤主应用访问微应用css静态图片资源报404

settings文件是封了一下src\settings.js。.env.development文件中。发现static前没有加我指定的前缀。.env.production文件中。

原创 git 给分支添加描述

需求:分支多了不知道当前分支的用处可以使用git br用来描述。给f-230825-4-zhou分支备注。再次git br查看效果。

原创 vue筛选框封装

点击对默认查询条件之外的条件进行 增加或删除在使用的组件或标签加入:filtrateList="filtrateList"传入条件查询数组当前demo写在xk-page中,就以xk-page组件为例

原创 vue el-table自动无限滚动

原先方案是用el-table-column插件来实现但发现在el-table-column的原理是copy原数据做为第二份数据中show-overflow-tooltip会失效,所以换了个JS写法。

原创 echarts 多个series时自定义tooltip切换图例legend报错

bug:当series有两条数据,legend取消一条后hover到echarts中会报错。tooltip:下的错误代码。

原创 Commitizen -- 自动生成合格的 commit message

Commitizen -- 能够根据提示自动生成符合规范的 commit message。是一个撰写合格 Commit message 的工具。安装所需——commitizen。现在可对commit规范进行配置。完成配置后，我们现在就可以使用。在项目的根目录创建文件。

原创 vue commit提交代码husky+lint-staged进行校验

需求:项目中用到了eslint+prettier对格式及语法校验但是commit的时候还是可以正常提交,所以需要用到一些插件来解决这个问题需要的效果如下:首先在搭建项目的时候选择了使用eslint;如果没有请先自行安装新建.eslintrc.js配置文件新建.eslintignore指定eslint忽略文件和目录安装prettier开发环境新建.prettierrc配置文件（仅做参考，自行补充）安装husky及lint-staged开发环境启动hooks添加prepare指令通过npm设置。

原创 npm 创建一个自己的npm仓库包

在vscode中创建一个文件用来放置方法(我以lib为例,我是在vue里边开发开写包,你们可以单独写不一定要写在vue中根据各自情况)如果npm link没有生成package-lock.json 就可以查看下node版本,我的是16生成不了;有时候nrm ls 并不会有*来表示当前的镜像可以试下nrm test 这样就可以知道当的是什么镜像。具体npm命令属性可参考。

原创 iframe 嵌套外部地址导致外部页面中的echart样式失效

注:echart在iframe中使用不可以作百分号为单位不然样式会失效。我这里是跨域的还是两个项目。

原创 vue 自适应布局postcss-px-to-viewport

在根目录下建js文件。

原创 js判断字符超长度中间用...替换

需求如果字符大于14个就中间用....

原创 md文件转html

会在文件中生成一个Preview文件里存放的就是转换的Html。调用i5ting_toc实现md 转html功能。将i5ting_toc安装为全局包。

原创 切换npm 的下包镜像

2.将 下包的镜像切换为淘宝镜像源。2.1.1查看可使用的镜像列表。3.查看镜像源是否下载成功。1.查看当前的下包镜像源。2.1.2 切换淘宝源。2.1.3测试下载速度。

原创 vue+antdesign 实现九宫格加弓字形左右下箭头

图片是九宫格布局,第一排图片之间的箭头为右箭头,第二排箭头为左箭头,以此类推,下箭头需求是以弓字形显示,卡片右侧内容Hover的时候要出现tip。注意最后一排不足三个的时候要隐藏横向箭头,并隐藏下箭头。

原创 vue+Ant Design进度条滑块与input联动

需求:滑块进度与输入框为一致,默认值为80,最小不能小于30,最大为100 子组件:父组件使用

原创 webpack5 使用node调试

有时候在开发的时候查看代码走势很不方便我们可以用Node进行调试webapck.json//inspect为调试 -brk为在道行打个断点的意思 运行webpack指令加载cli文件运行npm run debug

原创 webpack5 PWA解决Web App 项目网络离线情况没法访问情况

渐进式网络应用程序 | webpack 中文文档 webpack.config.js(生产环境)注册 Service Workermian.jsnpm run build直接打开index.html提示因为我们打开的访问路径是：。此时页面会去请求 文件，请求路径是：，这样找不到会 404。实际 文件路径是：。 解决方案 运行命令要部署的目录再次运行 来构建包含注册代码版本的应用程序。访问 并查看 console 控制台。在那里你应该看到： 总结:core-js兼