前端 终端 实战vue

vue全家桶进阶之路29:Element Plus

Element Plus是一个用于Vue.js的UI组件库,为开发人员提供了一组可重用和可定制化的组件,用于构建现代Web应用程序。它是流行的Element UI库的扩展,重点是提高性能和可访问性。 Element Plus包括广泛的组件,如按钮、表单、表格、对话框等。 除了常规的UI组件外,Ele ......
全家 Element Plus vue

前端代码0bug经验分享

如何写好代码其实是一个很大的话题,本次仅分享一些自己的经验之谈,有其他idea的欢迎交流 在我看来,写好代码更多的是逻辑思维的体现,而这,紧靠一两次分享是无法提高的,我只能尽可能的将可能可以复制的经验进行分享 本次分享不会涉及太多你使用的框架的具体使用细节,技术选型总是千变万化的,我们需要的是抓住不 ......
前端 代码 经验 0bug bug

雪花算法生成的Id过长,前端接收精度丢失

1.问题现象: 表的Id使用雪花算法生成,数据库使用bigint类型可以正常存储,后端使用Long类型也可以正常接收,postman进行请求测试,也可以看到后端正常返回的数据,但是前端接收后显示的id不正常。 2.问题原因: 前端使用number类型进行接收,number类型的范围小于后台Long类 ......
前端 精度 算法 雪花

vue-video-player简单例子之mp4视频链接

1.首先,在终端中使用以下命令安装vue-video-player npm install --save video.js vue-video-player 2.然后,在Vue.js组件中导入vue-video-player,并将其注册为组件 <template> <div> <video-play ......
vue-video-player 例子 链接 player video

vue生产环境跨域不生效

vue生产环境跨域不生效 开发环境跨域 项目集成了百度地图的api,在接入ip查询地址等功能时返回跨域报错,所以使用vite配置文件配置服务代理来解决。传送门 生成环境失效 测试跟我说内网功能失效了,在验证了程序确实build到最新版本之后,使用f12发现了api访问的地址并没有代理到百度地图api ......
环境 vue

前端FileReader 文件预览

这玩意好像挺强,可以操作用户选择的文件,转为base64或者二进制,blob; 1、实际应用 我的行车记录仪记录事反着放的,所以查看视频都是反过来的,那么我就写了个html,选择对应视频反向播放; input框选择视频文件后,我们就能拿到当前视频文件,使用 let f = new FileReade ......
前端 FileReader 文件

免费分享前端面试题,vue面试题,TypeScript基础知识点 PDF格式

免费分享前端资料,面试题,电子书 接前端开发,带徒弟,一对一教学,远程协助,bug修改 微信: ......
知识点 前端 TypeScript 格式 基础

Vue3.0学习二

组合式API:setup 在beforecreate之前就执行了。 import { ref, toRefs, toRef , h} from 'vue' export default { props:{ name: { type: String } }, //setup中使用props中的数据 s ......
Vue3 Vue

vue前端纯小白向快速扫盲贴集合

看的一些博客,对于刚入门被前端各种东西搞得头昏的小白扫盲还是很有帮助的,可以快速理解前端总说的一些东西到底是干什么的。 1 创建vue项目所需外部环境 node npm vue/cli脚手架 官网下载node.js 直接下一步下一步即可,管理员打开cmd 执行 node -v正确返回版本 如何升级n ......
前端 vue

vue admin plus 的菜单权限判断,菜单隐藏过滤,函数路径

main.ts -> setupRouter()router/index.ts -> setupPermissions()router/permissions.ts -> getUserInfo() && setRouters()store/modules/routes.ts -> filterRo ......
菜单 路径 函数 权限 admin

前端加入摄像机人脸识别(mediapipe)

前端加入摄像机人脸识别(mediapipe) import { Camera} from "@mediapipe/camera_utils"; import {FaceMesh} from "@mediapipe/face_mesh"; // <script src="https://cdn.jsd ......
人脸 前端 mediapipe 摄像机

asciinema 方便的终端录屏方案

asciinema 方便的终端录屏方案,我们可以直接使用cli 工具就可以方便的进行终端录制了,然后可以自己提供一份website 基于官方 提供的asciinema-player 进行播放 参考玩法 简单说明:我们可以基于s3 以及asciinema 提供的工具自己包装一个ui 当然也可以直接使用 ......
终端 asciinema 方案

前端cookie,localStorage,sessionStorage区别

图片源自B站up技术蛋老师的视频, 自己大体总结一下关键词:cookie:早期技术,体积小,本地和服务器都存储; localStorage:有效期无限(直至被手动删除),跨窗口,微信小程序等用的缓存storage基于此;sessionStorage:只能同一窗口中有效,有效期到窗口关闭 ......
前端 sessionStorage localStorage cookie

支持多种文件(docx、excel、pdf)预览的vue组件库,支持vue2/3。

原文链接 https://github.com/501351981/vue-office 功能特色 一站式:提供docx、pdf、excel多种文档的在线预览方案,有它就够了 简单:只需提供文档的src(网络地址)即可完成文档预览 体验好:选择每个文档的最佳预览方案,保证用户体验和性能都达到最佳状态 ......
组件 vue 多种 文件 excel

vue之按键事件与修饰符

按键事件 按键事件就是,按了键盘的一个按键,就会触发绑定函数的执行。 |按键|说明| | | | |keyup|按键弹起的时候触发(最常用)| |keydown|按键按下的时候触发| |keypress|按键按压的时候触发| 语法 # 在标签上进行定义 @keyup="函数" @keydown="函 ......
按键 事件 vue

Vue中axios请求后res返回204,no content,res.data为undefind

一直以为后台只要返回200-299之间的状态码就没问题,就是这个错误认知,花了三个小时终于想到解决办法 附上axios 地址 axios中文文档|axios中文网 | axios (axios-js.com) 前面一直想着后台能接收处理请求,肯定不是后台问题,一直花时间配置前端请求指令,以及设置响应 ......
res undefind content axios data

k8s前端js、css等资源文件CDN加速

序言:用户访问网站,网站的加载速度直接影响着用户体验问题;前端js、css等文件资源需要加速访问处理; 方案一:js、css、png等资源打包到文件服务器,文件服务器抛出连接,工程项目打包的时候publicpath使用文件服务器访问链接; 如图: 需要购买文件服务器,把资源文件推送到文件服务器上,由 ......
前端 文件 资源 k8s css

前端设计模式——MVVM模式

MVVM模式(Model-View-ViewModel):它的目标是将用户界面(UI)的逻辑与业务逻辑分离。该模式的核心思想是将UI分为视图(View)和视图模型(ViewModel),并通过数据绑定实现二者之间的通信。 在MVVM模式中,视图(View)表示用户界面的呈现部分,视图模型(ViewM ......
模式 设计模式 前端 MVVM

前后端Vue分离开发平台的前期准备

摘要: 之前我下载的一个快速开发平台,生成的前端代码不是Vue类型的,我发现下载的版本出现问题。我去找了一个前后端分离Vue的快速开发平台。但是配置又重新配,配置的过程中出现了很多的bug。 问题及解决 1、Mybatis-plus的技术升级 Could not resolve type alias ......
开发平台 前期 平台 Vue

vue3.0和2.0的区别

Vue.js是一个渐进式JavaScript框架,Vue.js 3.0相比于2.0有以下区别: 更快:Vue.js 3.0的渲染速度比2.0快了近30%。 更小:Vue.js 3.0的体积比2.0小了41%。 更易维护:Vue.js 3.0的代码结构更加清晰,更易于维护。 更易于原生:Vue.js ......
vue3 vue 2.0

使用vue2从零开始搭建自己的组件库(完整版)

前言 在前端开发中,除了常用的UI组件库以外,我们还会涉及到基于公司业务,需要定制化开发一些业务组件,还有随着项目的增多,开发人员的增多,为了提高工作效率,我们就需要统一管理好已开发好的业务组件。这时候我们就需要搭建自己的组件库,因为涉及到一些公司的业务,我们只能发布到私服的npm上。下面几点是我们 ......
整版 组件 vue2 vue

VSCode自建vue示例模板

步骤 打开File->Preferences->Configure User Snippets 选择New Global Snippets file... 输入名字(自定义),填入以下内容,注意修改vue.js路径 { "Print to console": { "prefix": "vue", " ......
示例 模板 VSCode vue

VUE3 目录结构

├── dist/ └── src/ ├── api/ // 接口请求目录 ├── assets/ // 静态资源目录 ├── common/ // 通用类库目录 ├── components/ // 公共组件目录 ├── router/ // 路由配置目录 ├── store/ // 状态管理目录 ......
结构 目录 VUE3 VUE

一个 OpenTiny,Vue2 Vue3 都支持!

TinyVue 是一套跨端、跨框架的企业级 UI 组件库,支持 Vue 2 和 Vue 3,支持 PC 端和移动端。今天给大家介绍如何同时在 Vue2 和 Vue3 项目中使用 TinyVue。 ......
Vue OpenTiny Vue2 Vue3

vue全家桶进阶之路28:项目仓库Gitee

Gitee(之前称为GitCafe)是一种基于web的Git仓库托管服务,在中国很受欢迎。它为开发人员提供了一个平台,可以托管他们的Git仓库,与其他开发人员协作,并管理他们的代码。 https://gitee.com/ Gitee支持多种版本控制工具,包括Git和SVN。它还提供了一些高级功能,例 ......
仓库 全家 项目 Gitee vue

LVS 和 Keepalived 介绍与实战操作演示

一、LVS 概述 LVS是Linux Virtual Server的缩写,是一种基于Linux内核实现的高可用性、高性能的负载均衡技术。它可以将来自客户端的请求分发到多台服务器上,实现多台服务器的负载均衡,提高整个系统的性能和可用性。 LVS技术主要包括以下几个组件: LVS调度器:负责接收客户端请 ......
Keepalived 实战 LVS

开源云原生存储rook:块存储快速入门实战

Block Devices(块存储) 在 Rook 中,块存储有两种存储类型:副本存储和纠删码存储。这两种存储类型都可以在 Kubernetes 集群中使用,可以通过在 CephBlockPool 中指定不同的存储类别来实现。 「副本存储:」 是一种基于副本的存储方式,其中数据被复制到多个节点上,以 ......
实战 rook

vue全家桶进阶之路27:Vue.js 3.0的下载和安装

使用脚手架vue-cli创建vue3项目,创建前需要准备以下: 1、node.js环境 见:https://www.cnblogs.com/beichengshiqiao/p/17251233.html 2、npm、cnpm工具 见:https://www.cnblogs.com/beichengs ......
全家 vue Vue 3.0 js

vue全家桶进阶之路26:Vue.js 3.0与Vue.js 2.x 的比较和注意事项

Vue.js 3.0 是 Vue.js 框架的最新版本,于 2020 年 9 月正式发布。Vue.js 3.0 主要的改进和新特性包括: 更好的性能:Vue.js 3.0 使用了更快的虚拟 DOM 实现,比 Vue.js 2.0 更快。 更小的体积:Vue.js 3.0 的代码体积比 Vue.js ......
全家 Vue 注意事项 事项 js

vue之双向数据绑定v-model

简介 在vue中,当修改了变量,页面内容会根据变量的变化而变化。但是如果页面变化了,变量不会变化,这个就是单向数据绑定。当页面变化,变量也会跟着变化,这个是双向数据绑定 语法 <input type="text" v-model="变量"> 示例 <body> <div id="app"> <!-- ......
双向 v-model 数据 model vue