tenfei的个人主页-纳摩尔

tenfei

性格左右命运，气度影响格局。

脂批：略见曹公之影，而不见其形也！

作者推荐最受欢迎最多阅读评论最多

• 交换机

交换机配置常用指令及配置说明

交换机常用配置指令，在配置交换机或在项目中过程中如何查看交换机的配置状态，端口 vlan trunk等规则配置命令，查询交换机的配置情况，更能快速的定位、解决交换机在配置过程中的一些问题。

493011个月前

• Nuxt

GSAP动画组件在NUXT3中实现多目标交替动画延时效果。

GSAP是The GreenSock Animation Platform简写，是一个功能十分强大的动画平台，可以帮助我们实现大部分的动画需求，构建高性能的、适用于所有主要浏览器的高性能动画；GSAP非常的灵活，可以在任何框架上处理页面能够所有通过js改变的元素，不仅可以对div的css属性进行动画

195011个月前

• Nuxt

Nuxt3中使用状态记录并控制keepalive列表。

在Nuxt3页面级keepalive不可用问题已在v3.11版本中得到很好的解决，这里提供一个示例方法。首先得明白造成此问题的原因是keepalive的include项默认读取from.matched[0].components.default.__name的值，该值为vue默认组件的名称，但n

632038个月前

• NodeJs

nodejs改为国内源和参数方法

# NPM nodejs改为国内源和参数方法，在需要安装cnpm也可以使用淘宝镜像，提高国内访问速度，由于Node的官方模块仓库网速太慢，模块仓库需要切换到阿里的源。 **查看当前镜像地址** ```text npm config get registry ``` **NPM修改为淘宝镜像*

520019个月前

• JavaScript

js下数组数组的并集、交集、差集处理方式

记一下js下数组数组的并集、交集、差集处理方式，不出现重复项，得到的结果是一个新数组，使用ES5语法来实现虽然会麻烦些，但兼容性最好，不用考虑浏览器JavaScript版本。也不用引入三方库。 ```typescript const arr1=[33,22,22,55,33,11,33,5]; c

455028个月前

• 网络基础

常用网络故障排除命令及使用方法。

IP链路测试命令是计算机网络中常用的一种命令行工具，用于诊断和排除网络故障。其中包括诸如ping、tracert、nslookup等命令，它们可以帮助网络管理员或技术人员发现网络故障的根本原因，减少网络维护和故障排除的时间和成本。其中，ping命令可以测试主机之间的网络连接是否正常，tracert命

716021年前

• 交换机

华为交换机vlan划分及hybrid、trunk配置包括线路聚合

华为交换机建立本地配置环境，将主机的串口通过配置电缆与以太网交换机的Console口连接。使用console口配置交换机，实现vlan划分及trunk聚合线路方法。使用SecureCRT连接交换机，这里使用了usb转com的rj45线来连接，装好驱动后在电脑设备中查看com端口，使用Secure

949031个月前

• Vditor

Vditor自定义工具栏按钮，实现从素材库选择或上传图片功能。

Vditor 是一款浏览器端的 Markdown 编辑器，支持所见即所得、即时渲染（类似 Typora）和分屏预览模式。它使用 TypeScript 实现，支持原生 JavaScript、Vue、React、Angular，提供桌面版。这里主要分享Vditor自定义图片上传工具栏按钮，实现自定义

1018031年前

• ROS

RouterOS V7.x下一键创建VPN并指定路由

Mikrotik的RouterOS已更新到v7版本，其中有不少的改进，特别是在wireguard提升不少，但同时也带来一些与v6.x不同的操作，这里主要记录一下在ros v7.x下一键添加VPN并进行路由标记的方法。同时也会注明与v6.x的不同之处。脚本一键创建多VPN，默认创建为l2tp的模式

1097031年前

• ROS

RouterOS禁止某个局域网某IP或地址段上网

使用RouterOS禁止局域网中某个IP或地址段访问外网的配置方法，首先我们要明确目标IP和外网端口即可通过ros的Filter Rules来实现。 1. 添加IP-Firewall-Filter Rules-Add New新的规则 2. 设置：Chain:Forward Src.Address:

1706031年前

• NodeJs

使用PM2配置并部署项目上线。

无论我们使用VUE、REACT、NUXT等各种框架开发项目后，最终上线部署都会选择PM2，特别是对于需要Nodejs做Server支撑的项目，因pm2是基于nodejs开发的进程管理器，适用于后台常驻脚本管理，同时对node网络应用有自建负载均衡功能。 **一、pm2特点：说一些pm2有哪些优点好

606021年前

• Vditor

Vditor富文本编辑器支持NUXT下SSR服务端渲染。

分享一款新发现的非常好用的所见即所得的富文本编辑器，不同于其它的富文本编辑器，Vditor使用了Markdown基础编辑方式的同时引入所见即所得、即时渲染、分屏预览几种模式可选择。 Vditor官方网站https://b3log.org/vditor/也有对Vditor描述为一款浏览器端的 Mar

982031年前

• ROS

Mikrotik的RouterOS查询并发控制数计算待机数量

Mikrotik的RouterOS查询设备最大并发控制数及当前并发数，通过当前已知接入设备可以得到当前工作状态设备的并发线程数，可简单借助以下方法算出设备最大带机数量。 **计算方法：** ``` 最大并发控制数 / 30 / 当前单机线程 = 大致带机数 ``` **查看当前设备的最大并发

666031年前

• Mysql

Mysql2使用连接池对高频语句预处理以提升性能。

Mysql2适用于Node.js的MySQL客户端，专注于性能优化。支持SQL预处理、非UTF-8编码支持、二进制文件编码支持、压缩和SSL等等，这里主要记录一下使用预处理功能。使用 MySQL2预处理的使用，可以提前准备好SQL预处理语句。使用准备好的SQL预处理语句，MySQL 不必每次都

700031年前

• AnimeJs

animejs动画库推荐及Vue下与transition动画

记录一下最近新发现并立即应用到项目开发的一个强大动画库——animejs。 anime.js是一个强大的用来制作动画的javascript库，功能上基本与GASP（greensock）没有差距，之所以在github上短期内获得大量追捧和收获赞，就在于其足够轻便，gzip压缩完只有9kb左右，同

948021年前

• Nuxt

Nuxt3下引入tailwindcss及其它色系和字号模板

Nuxt3下引入tailwindcss，从最初的手写style文件到使用bootstrat5的CSS框架，最终我选择tailwindcss。TailwindCSS官方称一个可以让你脱离css文件，在html直接通过class修改样式的框架，在通过一两个项目的引入使用后最终决定以后都使用它了，这里主要

1262131年前

• Nuxt

Nuxt3下计划任务或时间时限任务执行。

Nuxt3下利用./server/plugins服务端插件实现计划任务或时间时限任务执行。在/server/plugins下建立的任意文件，均会在服务器启动时就执行，在插件内挂入setTimeout或setInterval即可实现计划任务工作，nitroApp中还包含了hook可调用。 ```

735021年前

• Nuxt

Nuxt3下推荐一款svg图标组件——nuxt-icon

1150021年前

• Nuxt

Nuxt3页面级keepalive的Bug临时解决方案

Nuxt3有关3.5.1版仍然存在的一个NuxtPage页面级keepalive的内部bug问题，导致keepalive无法正常工作，其内置三个参数 include,exclude,max只有max参数能得到支持。 ``` <NuxtPage :keepalive="{max:5}"/> ```

2550221年前

• NodeJs

axios提交数据前拦截并对formData数据进行转换提交

使用axios进行ajax提交数据时，进行数据拦截整理后再提交，可很好的帮助我们在开发过程中实现前后端数据交互工作，尤其是前端接口不统一，有时以对象提交，有时又formData提交导致数据不统一等问题。另在vue环境下，当使用formData收集数据并提交给后端时，会出现空值、未定义值在传输过程中被

715021年前

• NodeJs

Nodejs下微信支付与本地开发环境搭建

Nodejs下微信支付与本地开发环境搭建，众所周知微信的公众号小程序本地开发过程中实分不友好，不管是认证，调试需要反复的上传给开发过程带来诸多不便，微信的支付环境更是要求更加严苛，而且官方还不提供nodejs的开发范例及sdk。此文我们主要讲如何实现本地开发微信公众号和小程序的环境搭建及node

728021年前

• Vue

VUE与NUXT3通用省市区地址三级联动选择组件。

NUXT3与VUE通用省市区地址三级联动选择组件，组件使用了VUE3的Setup语法糖，由于地址太多发布不全，这里只提供了几个典型的省市区模板参考，其它省市区还得自己去补齐。街道门牌号必须大于5个字符才会正常返回地址内容给父级组件，同时支持父级组件回传地址并自动识别省份、城市、区县并自动处于

809021年前

• ROS

ros配置ddns自动解析花生壳域名

使用RouterOS的脚本配合计划任务的定时执行可实现自动解析花生壳域名到指定IP地址，当然还需要端口映射（在我之前的文章中已经有分享过相关脚本程序代码）。也可以配合pppoe或wan端口的监听脚本，当Ip变化时则执行以下脚本可以更及时的实现动态解析，以达到完美的ddns功能。在ROS中使用花生

943021年前

• ROS

RouterOS做内网端口映射

端口映射的功能主要就是实现互联网可以访问当前映射的电脑，想要实现端口映射的方式也有很多，用ros实现端口映射就是其中的一种方式。这里我们主要说说用RouterOS做内网端口映射，并提供自动脚本。也可以设计计划任务定时或路由开机重启后自动执行脚本。以下是脚本代码，代码内已做判断，如果目标映射端口已

586021年前

• Vue

Vue3和Nuxt3下使用qrcode.vue生成二维码。

1129021年前

• Nuxt

记一次Nuxt3从v3-rc版升级到v3正式版后报错问题。

记一次Nuxt3从v3.0.0-rc.x版升级到v3.x正式版后，项目npm run dev模式下一切正常，只有在npm run build时报错，报错内容如下： ``` Nuxt 3.1.1 with Nitro 2.1.1 Error: Error: Cannot find module st

669021年前

• Nuxt

NUXT3自动下发不同宽高图片缩略图组件。

NUXT3下使用sharp图像处理组件，按照客户端需要图片大小读取上传的图片并以文件流形式下发到客户端，可省略掉上传时需要缩略图，且可满足客户端对图片的各种大小的缩略图需求，也可节省请求次数和流量。亦可加入限制和请求访问TOKEN过滤掉跨站请求图片。

1081131年前

• Vue

vue3和nuxt3下FontAwesomeIcon图标组件

在VUE3和NUXT3中使用Font-Awesome-Icon 这个SVG图标库优势就不用说了，又多又好用，还不用全库导入成字体导致首页加载慢等问题。 1. 在vue3中components文件夹下建立 FontAwesomeIcon.vue 2. NUXT3中components文件夹下建立Fo

1036021年前

• ROS

ROS VRRP虚拟MAC地址

主要用于个别区域网络运营商会检查拨号的MAC地址，如已有人使用ROS多拨，会导致MAC地址冲突不能正常拨号上网问题，这种情况则可使用RouterOS的VRRP虚拟MAC地址实现多拨。变量实例：mac1 "00:E0:4C:" 用以指定MAC地址前三段，后面会自动补充，:set bridgeName

1020021年前

• ROS

RouterOS自动过滤24小时内已使用过IP地址

RouterOS自动过滤24小时内已使用过IP地址，重复则自动断开再次ADSL拨号，客户端断开网络连接或关闭WIFI后，10秒延迟后自被主机自动监测到，就会断开相对应的ADSL连接，同时也就实现了客户端下线后自动换IP地址，需要IP供应商改为桥接模式才可实现，须拨号得到公网IP的环境下有效，内网10

1342021年前

• ROS

ROS多线叠加PCC参数掉线自动修正

ros多拨会存在某线断开，无法实现PCC分线问题，分享一段PCC在多拨下的自动修正程序： #将脚本命名保存，创建计划任务执行:execute script="脚本名称" ``` :local status :local i 0 :local x 0 :local y 0 :local z 0

900021年前

• ROS

RouteOS小包优先，防下载影响游戏数据，宽带自动控流。

#wanName用来指定上网口，dhcp模式直接填写端口全名，如果是多拨可直接指定pppoe-out不用每个拨号都指定 speedMax为最大带宽，单位K。 upMax为上传最大带宽与下载同理 outEther为流量出口以便于监控并触发限速. ``` :local wanName "pppo

1946121年前

创作主题

赞助商广告位

tenfei

性格左右命运，气度影响格局。

交换机配置常用指令及配置说明

GSAP动画组件在NUXT3中实现多目标交替动画延时效果。

Nuxt3中使用状态记录并控制keepalive列表。

nodejs改为国内源和参数方法

js下数组数组的并集、交集、差集处理方式

常用网络故障排除命令及使用方法。

华为交换机vlan划分及hybrid、trunk配置包括线路聚合

Vditor自定义工具栏按钮，实现从素材库选择或上传图片功能。

RouterOS V7.x下一键创建VPN并指定路由

RouterOS禁止某个局域网某IP或地址段上网

使用PM2配置并部署项目上线。

Vditor富文本编辑器支持NUXT下SSR服务端渲染。

Mikrotik的RouterOS查询并发控制数计算待机数量

Mysql2使用连接池对高频语句预处理以提升性能。

animejs动画库推荐及Vue下与transition动画

Nuxt3下引入tailwindcss及其它色系和字号模板

Nuxt3下计划任务或时间时限任务执行。

Nuxt3下推荐一款svg图标组件——nuxt-icon

Nuxt3页面级keepalive的Bug临时解决方案

axios提交数据前拦截并对formData数据进行转换提交

Nodejs下微信支付与本地开发环境搭建

VUE与NUXT3通用省市区地址三级联动选择组件。

ros配置ddns自动解析花生壳域名

RouterOS做内网端口映射

Vue3和Nuxt3下使用qrcode.vue生成二维码。

记一次Nuxt3从v3-rc版升级到v3正式版后报错问题。

推荐NUXT3下nodemailer邮件发送组件。

NUXT3自动下发不同宽高图片缩略图组件。

推荐一个VUE3和NUXT3通用TOAST消息提醒组件。

vue3和nuxt3下FontAwesomeIcon图标组件

ROS VRRP虚拟MAC地址

RouterOS自动过滤24小时内已使用过IP地址

ROS多线叠加PCC参数掉线自动修正

RouteOS小包优先，防下载影响游戏数据，宽带自动控流。

创作主题