前端 终端 实战vue

前端 - 使用json-server搭建单机mock平台

使用json-server搭建单机mock平台 简介 json-server是一个 Node 模块,可以指定一个json文件作为数据源,运行 Express 服务器。可以用来在本地快速搭建一个REST API风格的后端服务,模拟服务端接口数据。 官网地址:json-server - npm (npm ......
前端 json-server 单机 server 平台

使用vue在移动端显示树状多选功能

最近的项目要求是做一个树状的多选功能,然而该项目是使用vant4作为前端的框架,vant4只有树状单选,没有多选的,那只能自己写一个了。 借鉴博主 https://blog.csdn.net/m0_68428581/article/details/130641982, 我将他的代码转成了vue3的语 ......
功能 vue

【前端开发】免费统计个人网站、网页访问次数、访问设备、访问人地点等数据教程

前言:在该网站选择小组件样式、生成代码后插入到自己的网页即可 网站地址:https://whos.amung.us/ 第一步:选择小组件样式,并生成代码 第二步:将代码插入网页 第三步:网页中会出现统计次数小组件,点击小组件会跳转到统计详情页 最后,统计详情页会看到统计到的次数、地域、设备等信息 ......

使用 Alacritty 替代 Gnome-Terminal 解决 Ubuntu 中终端的行间距问题

之前有篇随笔主要揭露了 Ubuntu 22.04 中 Terminal 中的行间距过大的问题,该问题对 Powerline 类的主题影响尤其大。关键是对于这个问题,网上反映的人很少,我也很郁闷。经过长时间关注,终于找到一个可以完美替代 Gnome-Terminal 的终端软件,可以解决以上问题,特推... ......

在vue中使用XLSX库实现Excel的导入导出

XLSX库是个十分强大的利用前端js处理excel文档的库,官网:https://www.sheetjs.com/ vue中安装即使用: 安装 pnpm install xlsx pnpm install xlsx-style-hzx //设置边框与格式用 使用 <div @click="expor ......
Excel XLSX vue

Vue学习笔记(十):全局事件总线

之前博客中介绍了prop和调用事件的方式在父-子组件之间进行数据,这种方式在只有一层嵌套层时可以使用,但是路过存在多层嵌套,多层多个“兄弟”组件之间传递数据,就非常麻烦。对此,vue中提供了一种全局事件总线机制,数据传递是通过一个空的Vue实例作为中央事件总线,通过它来触发事件和监听事件,可以实现几... ......
总线 全局 事件 笔记 Vue

1前端开发

前端简介 """ 强调:前端 和 数据库 学习的时候跟python一毛钱关系都没有 前端的学习是非常简单的 但是也很枯燥 没有太多的逻辑 数据库的学习有点难度 但是主要还是以记忆为主 大量练习肯定能掌握 ps:前端数据库学不好 完全就是因为自己不够努力 记的少了 练得少了 """ # 1.什么是前端 ......
前端

2023-10-13 前端部署redis,配合使用fastify实现项目自动化构建(长期更新)

前言:根据需求,要求在前端完成项目自动化构建。 redis是本地安装的。 系统:windows 10 1.安装redis 一般都是去官网下载👉https://redis.io/download/ 安装说明,能next的就next,能勾选的全勾选上,下面那个500M是我自设的,默认是100M 端口是 ......
前端 fastify 项目 redis 2023

从原理到实战,详解XXE攻击

本文分享自华为云社区《【安全攻防】深入浅出实战系列专题-XXE攻击》,作者: MDKing。 1 基本概念 XML基础:XML 指可扩展标记语言(Extensible Markup Language),是一种与HTML类似的纯文本的标记语言,设计宗旨是为了传输数据,而非显示数据。是W3C的推荐标准。 ......
实战 原理 XXE

vue el-select/el-cascader获取选中的对象label值

1.el-select获取选中对象label值 <el-form-item label="车辆配置" prop="sales_name"> <el-select v-if="!showSaleNameInput" v-model="form.sales_name" clearable ref="it ......
el-cascader el-select cascader 对象 select

2. Vue简介

三大问题(是什么,为什么,怎么办):Vue是帮助前端优化开发的一个工具,是一个框架 渐进式框架的概念 Vue2 --> Vue3 ......
简介 Vue

Vue监听路由的变化

方式一:watch监听 通过watch监听,当路由发生变化的时候执行 watch:{ $route(to,from){ console.log(to.path); } }, // 或者 watch: { $route: { handler: function(val, oldVal){ consol ......
路由 Vue

Linux脚本内开异步进程和终端开异步进程区别

sleep.sh内容 sleep 1000 & echo $! 脚本内开异步进程是1号进程的子进程 终端开异步进程是当前bash进程的子进程 在关闭终端后该异步进程会停止 停止终端时想要继续执行,使用nohup sleep 1000 &,刚开始是终端bash进程的子进程,在终端停止后会变成1号进程的 ......
进程 脚本 终端 Linux

Skywalking APM监控系列(二、Mysql、Linux服务器与前端JS接入Skywalking监听)

前言 上篇我们介绍了Skywalking的基本概念与如何接入.Net Core项目,感兴趣可以去看看: Skywalking APM监控系列(一丶.NET5.0+接入Skywalking监听) 本篇我们主要讲解一下Skywalking如何接入mysql数据库监听与Linux服务器的监听 其实从Sky ......
Skywalking 前端 服务器 Mysql Linux

汇编实战!手把手教你从“计算器”入门汇编语言

基于汇编语言的简单整数计算器设计与实现 (此代码仅供学习使用,请勿用作其他用途) 摘要 本论文介绍了一款使用汇编语言编写的简单整数计算器程序,该程序支持基本的四则运算操作,并能处理包含括号的数学表达式。本文通过分析程序的代码结构,宏定义、数据段、子程序以及关键功能的实现,详细介绍了其设计与实现。同时 ......
计算器 实战 语言

vue中v-bind绑定元素属性

vue中v-bind绑定元素属性 <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1.0"> <title>vue.js</title> </he ......
属性 元素 v-bind bind vue

vue中的v-text指令和v-html指令区别

<html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1.0"> <title>vue.js</title> </head> <body> <div i ......
指令 v-text v-html text html

docker入门加实战—docker常见命令

本文介绍了docker的常见命令。比如docker pull,docker images,docker run等,并以拉取、运行、删除nginx为例来介绍相关命令。 ......
docker 实战 命令 常见

前端开发工具

前端开发工具 开发环境 Node.js 开启了前端啥都想写一点的时代 😁😀 npm nodeJs自带的包管理器 cnpm 淘宝网提供的npm的国内镜像加速工具 pnpm 采用集中式的依赖存储,极大节省硬盘空间. 唉, 主流语言的依赖地狱都是个问题. 依然可以使用淘宝提供的镜像 git 开发工具 ......
前端 开发工具 工具

盘点一个多Excel表格数据合并的实战案例

大家好,我是皮皮。 一、前言 前几天在Python最强王者交流群【哎呦喂 是豆子~】问了一个Python自动化办公的问题,一起来看看吧。 大佬们 请问下这个数据怎么实现 存在n个dataframe数据,想把数据写到同一个工作簿同一个sheet里面的,但是一直数据追加不成功,然后我试着写到同一个工作簿 ......
实战 表格 案例 数据 Excel

手把手教你写一个JSON在线解析的前端网站1

前言 作为一名Android开发,经常要跟后端同事联调接口,那么总避免不了要格式化接口返回值,将其转换为清晰直观高亮的UI样式以及折叠部分内容,方便我们查看定位关键的信息。 一直以来都是打开Google 搜索json格式化关键字,然后选择Google推荐的前三名的网址,比如 bejson网站: ht ......
前端 网站 JSON

【前端css】全局修改css让网页置灰,去掉色彩

html { filter: grayscale(100%);//IE浏览器 -webkit-filter: grayscale(100%);//谷歌浏览器 -moz-filter: grayscale(100%);//火狐 -ms-filter: grayscale(100%); -o-filte ......
前端 全局 css 色彩 网页

【vue2】实现css动效逐个顺序展示的效果(简陋版)

效果(进入预约里程碑模块后,小人从第一个台阶逐个闪烁出现在当前预约等级之前的台阶并消失,最终停留在当前预约等级的台阶上): 虽然很low但是!就是这么设计的!于是在原本静态的代码上稍加了些修改(为什么,为什么,想问天问大地) 首先是台阶部分的代码: <div :class="$style.reser ......
顺序 效果 vue2 vue css

vue中下载excel文件4种方法,2、通过 a 标签 download 属性结合 blob 构造函数下载发送post请求和后台poi返回文件流实现下载

vue中下载excel文件4种方法,2、通过 a 标签 download 属性结合 blob 构造函数下载发送post请求和后台poi返回文件流实现下载 1、通过url下载 即后端提供文件的地址,直接使用浏览器去下载 通过window.location.href = 文件路径下载 window.lo ......
文件 函数 后台 download 属性

后端数据改变后,前端实时获取改变的数据

前端要实时获取到后端变化的数据,可以使用websocket(实现双向通讯的协议)或者SSE用于从服务器向客户端的单向实时事件流。 两种方法的实现方式: 使用WebSocket: 1、创建WebSocket连接:在前端使用WebSocket API来创建WebSocket连接到后端服务器。 // 建立 ......
数据 前端 实时

Vue报错Syntax Error:TypeError: this.getOptions is not a function的解决方法~

前几天在vue运行项目过程中报错了,这个方法是 关于Vue报错Syntax Error:TypeError: this.getOptions is not a function的解决方法 (1)报错一 (2)报错二~ 1.1问题分析 首先,检查代码,并没有什么错误的地方;其次,涉及到这个问题,可能就 ......
getOptions TypeError function 方法 Syntax

【前端小技巧】如何使用 Eolink Apilkit 调用 Mock ?

在开发过程中,进度比较赶的情况下,前端人员当页面写完时,后台的接口还没写完,等要交付的时候后端才把接口给你,这个时候就很尴尬。 这个时候 Mock 就可以很好的解决这个问题,前端团队可以在 API 还没开发完成的情况下,借助 Mock API 实现预对接,加速开发进程。测试团队可以通过 Mock A ......
前端 Apilkit 技巧 Eolink Mock

项目中前端如何实现无感刷新 token!

1、问题 上用户在使用的时候,偶尔会出现突然跳转到登录页面,需要重新登录的现象。 2、原因 突然跳转到登录页面,是由于当前的 token 过期,导致请求失败;在 axios 的响应拦截axiosInstance.interceptors.response.use中处理失败请求返回的状态码 401,此 ......
前端 项目 token

Vue3实战(05)-教你快速搭建Vue3工程化项目

除了Vue 3这个库,还需Vue 3 最新全家桶。 1 环境准备 之前语法演示直接使用script引入Vue 3,从而在浏览器里实现所有调试功能。但实际项目中,使用专门调试工具。在项目上线之前,代码也需打包压缩,并考虑到研发效率和代码可维护性,所以在下面,需建立一个工程化项目实现这些功能。 工具 V ......
Vue3 实战 Vue 项目 工程

vue 中window.onresize有时不生效问题

在vue中多个组件中都使用window.onresize=()=>{},会导致前边赋值的方法被覆盖掉 改成 window.removeEventListener('resize', ()=>{}) 可生效 methods: { myFunction() { ... } }, mounted(){ / ......
onresize window 问题 vue