LeDao's Blog

介绍Apifox Helper是Apifox官方开发的一个IntelliJ IDEA插件，可以根据Controller层的接口方法快速在Apifox中自动生成接口文档，以进行接口测试 Apifox的官网地址：Apifox - API 文档、调试、Mock、测试一体化协作平台 使用文档：帮助中心 | Apifox 使用文档 使用生成API访问令牌根据下图生成一个访问令牌，该令牌只有在创建时才能看到，所以要保管好，不然忘记了就只能再重新新建一个 获取项目ID打开新建的项目，根据下图获取项目的ID 配置Apifox Helper打开IntelliJ IDEA的设置后，根据下图配置Apifox Helper，模块项目ID配置可以有多个 生成接口文档 生成一个类的某个方法的文档 生成一个类的全部方法的文档 生成多个类的全部方法的文档 配置Apifox请求的前置URL打开项目后，根据下图配置请求的前置URL，这样每次请求都会自动加上了

介绍进行前端开发时，电脑上会有很多node_modules包，会占用很多磁盘空间，我们可以把一些暂时不会打开的项目的node_modules包删除掉，等到要运行项目的时候再安装回来，如果我们一个个手动删除的话，会很麻烦 npkill可以很好的解决上述问题，不仅可以快速找到某个文件夹下的全部node_modules包，还可以根据路径、大小和上次修改时间进行排序，管理起来更加方便 安装打开cmd然后执行下面命令即可完成安装，不安装也可以使用npkill 1npm i -g npkill 使用cmd进入一个文件夹后，执行下面命令即可搜索该文件夹下的全部node_modules包，方向键的上下可以选择node_modules包，用空格键删除，直接删除不会有确认提示 不安装使用1npx npkill 安装后使用1npkill 参数一般只用到-s参数根据size进行排序 参数 说明 默认 -c, --bg-color 更改行突出显示颜色，可用颜色有: blue,cyan,magenta,white,red ,yellow blue -d, --directory 设置要开始 ...

介绍使用MyBatis-Plus开发时，一般开发的顺序都是：新建数据库表、实体类、Mapper接口、Mapper.xml文件、Service接口、Service接口实现类，然后才进行相应业务的开发工作 上面的操作都是重复性的，如果已经熟悉了MyBatis-Plus的基本使用，经常做这些重复性的工作对我们没有什么好处，如果这些操作可以自动完成，就可以提高工作效率了 MyBatis-Plus官方出了一个名叫MyBatisX的插件，可以有效解决上述问题，我们只需要自己手动在数据库中新建一张表，然后就可以使用插件自动生成实体类、Mapper接口、Mapper.xml文件、Service接口、Service接口实现类的基础模板了 使用安装直接到IntelliJ IDEA的插件市场安装即可 连接数据库需要在IntelliJ IDEA中配置数据源，具体操作步骤查看博客：IntelliJ IDEA 连接 MySQL 数据库 | LeDao’s Blog (zoutl.cn) 开始生成右键点击对应的数据库表，然后选择MybatisX-Generator 然后配置生成代码的存放位置，图片下的表格是参数的 ...

介绍Vim是Vi的升级版本，可以当作Vi来使用，完全替代Vi，也就是说：不要使用Vi了，而是使用它的升级版本Vim 下面只列举了一些我常用的命令或快捷键，并不是列举全部，其它没有列出的命令或快捷键如果用到了就在下方放出 常用命令说明我把Vim命令的类型分为命令模式、输入模式和底线命令模式，vim 文件名打开文件后就是命令模式，在命令模式下按下i键就切换到了输入模式，在命令模式下输入:就切换到了底线命令模式 命令模式vim 文件名打开文件后就是命令模式 命令或快捷键 说明 : 切换到底线命令模式 i 切换到输入模式 x 删除当前光标所在处的字符 dd 删除光标所在行 /关键词 向下搜索关键词，按n查找下一个搜索结果，按N则查找上一个 ?关键词 向上搜索关键词，按n查找上一个搜索结果，按N则查找下一个，和上面相反 v 切换到可视化模式，一般用于删除一段文本 r 切换到单字符替换模式，用于替换一个字符 R 切换到多字符替换模式，用于替换多个字符 输入模式在命令模式下，按下i键就切换到了输入模式，输入模式没有什么好说的，就和平时在Windows系 ...

打包项目使用下面命令将Vue项目打包，会生成一个名为dist的文件夹，然后将它上传到CentOS7系统中，也可以重命名这个文件夹以作区分 1npm run build 修改Nginx配置在配置文件中加入下面代码，我的配置文件路径为/etc/nginx/conf.d/default.conf，如果是部署到云服务器需要在安全组或防火墙中开放端口，不然无法访问 123456789server { listen 8081; #访问的端口 location / { root /home/project/vue/project-template; #要部署的Vue项目存放的位置 index index.html index.htm; #首页文件 try_files $uri $uri/ /index.html; #防止刷新后自动跳到自带404页面 }} 重新加载Nginx配置文件首先使用下面命令测试 Nginx 配置文件的语法和结构是否正确，而不会加载或应用这些配置，如果配置文件中存在语法错误或其他 ...

介绍和使用浏览器的全文翻译（机器翻译）相比，使用i18n实现国际化（人工翻译）应该会更准确，但是挺麻烦的，因为每一个组件的文字都需要翻译和配置 实现过程安装1npm install vue-i18n@next 新建语言配置文件在src目录下新建一个名为locales的目录，在这个目录下新建一个名为lang的目录、i18n.js和index.js文件，最后在lang目录下新建en.js和zh.js文件 en.js的内容如下： 1234567891011121314151617181920212223242526export default { menu: { name: 'Background', home: 'Home', userManage: 'Manage User', announcementManage: 'Manage Notice', typeManage: 'Manage Type& ...

介绍这里说的页面全屏和Microsoft Edge浏览器的F11快捷键的效果是一样的，Vue项目可以通过screenfull插件来实现 实现过程安装1npm install screenfull --save 常用方法 使用在要实现页面全屏效果的页面引入 1import screenfull from "screenfull" 实现页面全屏或退出全屏都直接调用下面函数即可 123const fullScreenOrNot = () => { screenfull.toggle();}

介绍uni-app 是一个使用Vue.js开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、Web（响应式）、以及各种小程序（微信/支付宝/百度/头条/飞书/QQ/快手/钉钉/淘宝）、快应用等多个平台 创建过程安装开发工具开发uni-app项目指定的开发工具是HBuilderX，下载地址为：HBuilderX-高效极客技巧 (dcloud.io) 开始创建文件>>路径>>项目 一般直接选择默认模板进行开发 运行项目运行到浏览器可以运行到电脑上安装的浏览器，也可以运行到HBuilderX内置的浏览器（推荐使用），第一次运行会自动安装一些插件 运行到小程序我这里说的小程序是微信小程序，需要先安装微信开发者工具，安装地址为：微信开发者工具下载地址与更新日志 | 微信开放文档 (qq.com)，安装好后打开服务端口（设置>>安全设置） 在HBuilderX中运行到微信开发者工具，会让我们配置微信开发者工具的安装路径，然后会自动打开微信开发者工具即可查看效果

概述和输入验证码相比，使用右滑拼图验证对用户更友好 右滑拼图验证插件的GitHub仓库地址为：javaLuo/vue-puzzle-vcode: vue 拼图人机验证 右滑拼图验证 (github.com) Vue2和Vue3的使用文档都有，根据自己的需求选择，我使用的是Vue3 实现安装1npm install vue3-puzzle-vcode --save 使用下面是一个最简单的例子，使用的图片是内置的 1234567891011121314151617181920212223<template> <button @click="onShow">开始验证</button> <Vcode :show="isShow" @success="onSuccess" @close="onClose" /></template><script setup> import { ref } from " ...

介绍Pinia是Vue的专属状态管理库，它允许我们跨组件或页面共享状态，官方文档链接：Home | Pinia (vuejs.org) 安装我使用的Vue.js版本是3.2.45（也就是Vue3），并且项目使用Vite4创建的，Vue3安装Pinia只需要执行下面的命令即可，Vue2则还需要安装一个插件，这里不讨论，可以去查看官方文档：安装 | Pinia (vuejs.org) 1npm install pinia 使用创建实例传递给应用创建一个pinia实例（根store）并将其传递给应用 12345678import { createApp } from 'vue'import { createPinia } from "pinia"import './style.css'import App from './App.vue'const pinia = createPinia()createApp(App).use(pinia).mount('#ap ...