vue3 - 前端优秀案例 vue-admin-box 推荐

news2024/11/17 23:53:56

vue-admin-box

简介

vue-admin-box是一个免费并且开源的中后台管理系统模板。使用最新版本的vue3开发而成。

演示地址

https://cmdparkour.gitee.io/vue-admin-box/icon-default.png?t=N7T8https://cmdparkour.gitee.io/vue-admin-box/

​编辑

简介

  • 更新日志
  • 经过三个多月的迭代,于2021年8月10日,1.0版本正式发布,并附四个基础模板供大家使用
  • 此开源项目为个人开发,不限制任何商业使用和个人研究,使用之前请先点个Star对我进行鼓励
  • 利用此开源项目参与的一切违法、色情相关的活动均与本源码无关,请勿以身示法
  • QQ交流群:912804007,有问题群里提,可及时解决

预览

  • demo国内
  • demo外国
  • github地址
  • 码云地址
  • 国内推荐使用yarn或者cnpm进行安装,npm安装容易产生问题

基础模板

共四个基础模板,均适合从零研发使用,可在github、码云仓库中直接查看,模板如下所示

  1. template-ts-i18n 基础模板,内含ts语法+国际化配置 github gitee demo
  2. template-ts 基础模板,只含ts语法,国际化已去除 github gitee demo
  3. template-js-i18n 基础模板,js语法 + 国际化配置 github gitee demo
  4. template-js 基础模板,js语法,国际化已去除 github gitee demo

介绍

vue-admin-box是一个免费并且开源的中后台管理系统模板。使用最新版本的vue3+vite+element-plus开发而成,目的是为了解决通用型的业务中后台系统复杂的配置。

特色功能
  • 适合中后台开发的路由配置、状态管理机制(状态默认支持本地存储)、已封装完善的axios及api管理机制
  • 极方便扩展的主题配置功能,默认支持三种典型的中后台风格
  • 简易配置的页面缓存功能,只需配置noCache属性,无需配置其他的任何属性,如组件名称,路由名称等等很多框架需要配置的东西
  • 典型增删改查的三种业务表格,详情请查看“页面栏目”内的“业务表格”、“分类联动表格”、“树联动表格”
  • 无路由跳转的刷新功能,支持缓存页面刷新,目前了解的多数框架都不支持缓存页面的刷新
  • 方便扩展的国际化解决方案,并提供了两套非国际化的基础模板和两套国际化的基础模板(ts版本/js版本)
  • 手写版本的各类自定义指令
  • 已经过多个中后台业务检验过的表格公用组件及弹窗公用组件,详情请查看“页面栏目”内的“业务表格”、“分类联动表格”、“树联动表格”
主要技术栈
  • MVVM框架:vue v3
  • 工程化管理:vite v2
  • UI框架:element-plus
  • 路由管理:vue-router v4
  • 状态管理:vuex v4
  • 数据请求:axios
  • 实用工具库:@vueuse/core

使用

  1. 获取源码资源包

    git clone https://github.com/cmdparkour/vue-admin-box.git
  2. 安装依赖,国内推荐使用cnpm或tyarn,国外推荐使用npm或yarn

    npm install
  3. 运行

    npm run dev 或 npm run start
  4. 打包

    npm run build

Partner project

  • Thinker-Aamin-Box - vue-admin-box的springboot后台,可使用java代码便捷创建vue界面
  • H5-dooring - 一款h5端页面可视化编辑器
  • ant-simple-pro - 一款支持vue3.0,react,angular,typescript等多框架支持的中台前端解决方案
  • vue-vben-admin - 使用了最新的vue3,vite2,TypeScript等主流技术开发,开箱即用的中后台前端解决方案

效果预览

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1550339.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

BRICK POP展示了有趣的链上游戏玩法与奖励机制

新游戏BRICK POP将Sui区块链技术与低Gas费用,以及其在Web3游戏开发方面的专业知识无缝结合。通过充分利用Sui和ONBUFF的INNO平台优势,BRICK POP为玩家提供了一个融合了前沿技术和引人入胜游戏的沉浸式游戏体验。BRICK POP游戏设计为实时交易和高用户参与…

Android 性能优化(六):启动优化的详细流程

书接上文,Android 性能优化(一):闪退、卡顿、耗电、APK 从用户体验角度有四个性能优化方向: 追求稳定,防止崩溃追求流畅,防止卡顿追求续航,防止耗损追求精简,防止臃肿 …

【MySQL】5.2MySQL高级语句与sql语句

模板 test、class、class0 mysql> select * from test; -------------------------------- | idcard | name | age | hobbid | -------------------------------- | 01 | lizi | 18 | guangjie | | 02 | monor | 22 | zhaijia | | 03 | sansan | …

FFMPEG C++封装(一)(C++ FFMPEG)

1 概述 FFMPEG是一个C语言开源视音频编解码库。本文将FFMPG4.1.3进行C封装,形成C FFMPG库。 2 架构 架构图如下所示: 架构说明: Init 初始化FFMPEG库。IStream 输入流,FFMPEG的输入音视频文件。Packet 音视频数据包Decoder 音视频编码器F…

electron打包桌面版.exe之vue项目踩坑(vue3+electron 解决打包后首页打开空白,打包后路由不跳转及请求不到后端数据等问题)

vue项目https://www.qingplus.cn/components-web/index打包桌面版问题集合 一、静态资源加载问题 npm run electron_dev桌面版运行后页面空白,内容未加载。 填坑: 打包配置要用相对路径 vite.config.ts文件中的base要改成./,之前加了项目…

Towhee 小记

文章目录 关于 Towhee✨ 项目特点🎓 快速入门流水线预定义流水线自定义流水线 🚀 核心概念 关于 Towhee Towhee 是一个开源的 embedding 框架,包含丰富的数据处理算法与神经网络模型。通过 Towhee,能够轻松地处理非结构化数据&am…

【QT】:基本框架

基本框架 一.创建程序二.初识函数1.main2.Widget.h3.Wight.cpp4.Wight.ui5.文件名.pro 三.生成的中间文件 本系列的Qt均使用Qt Creator进行程序编写。 一.创建程序 二.初识函数 1.main 2.Widget.h 3.Wight.cpp 4.Wight.ui 此时再点击编辑,就看到了ui文件的本体了。…

pt-archiver的实践分享,及为何要用 ob-archiver 归档数据的探讨

作者简介:肖杨,软件开发工程师 在数据密集型业务场景中,数据管理策略是否有效至关重要,它直接关系到系统性能与存储效率的提升。数据归档作为该策略的关键环节,不仅有助于优化数据库性能,还能有效降低存储成…

Android-Handler详解_使用篇

本文我将从Handler是什么、有什么、怎们用、啥原理,四个方面去分析。才疏学浅,如有错误,欢迎指正,多谢。 1.是什么 因为Android系统不允许在子线程访问UI组件,否则就会抛出异常。所以咱们平实用的最多的可能是在子线…

「媒体宣传」如何针对不同行业制定媒体邀约方案

传媒如春雨,润物细无声,大家好,我是51媒体网胡老师。 针对不同行业制定媒体邀约方案时,需要考虑行业特点、目标受众、媒体偏好以及市场趋势等因素。 一、懂行业 先弄清楚你的行业是啥样,有啥特别之处。 了解行业的热…

【地图构建(1)】占用栅格地图构建Occupancy grid mapping

本文主要参考Probabilistic Robotics《概率机器人》一书。 其他参考: 弗莱堡大学课件 博客 含代码博客 0.引言 位姿已知的地图构建(mapping with known poses)的定义:已知机器人的位姿 x 1 : t x_{1:t} x1:t​和传感器的观测数据 z 1 : t z_{1:t} z1:t…

绝地求生:报告长官!速去领取PUBG7周年礼包及7周年活动攻略【附方法】

奖励都需要长官们绑定全球账号,在游戏个人资料处查看是否有绑定! PUBG七周年礼包详情: 包含7周年快乐甜筒帽 7周年快乐背包(3级) 戴墨镜的幽灵 黑货票券 x30 档案管理员宝箱 x1 钥匙 x1 绑定ID登录,或…

【FIneBI可视化工具的使用】

前言: 💞💞大家好,书生♡,今天主要和大家分享一下可视化的工具FineBI的详细使用,希望对大家有所帮助。感谢大家关注点赞。 💞💞前路漫漫,希望大家坚持下去,不忘初心&…

大型驱动水冷负载电阻、缓冲器、滤波器和快速放电电阻

EAK业界首创双面水冷负载电阻器,独特的设计,用户更方便的串联并联使用,强大的水流带走更多因充放电带来的热量。AlN高可靠性氮化铝基板保证了热膨胀不会影响电阻的工作。 液冷电阻器使用水或离子水作为冷却剂。通过添加乙二醇,可以…

单调栈(C++)

单调栈,即栈中元素是单调递增的或是单调递减的,是一个比较好用的数据结构. 柱状图中最大的矩形 84. 柱状图中最大的矩形 - 力扣(LeetCode) 给定 n 个非负整数,用来表示柱状图中各个柱子的高度。每个柱子彼此相邻,且宽度为 1 。…

【SAP2000】在框架结构中应用分布式面板荷载Applying Distributed Panel Loads to Frame Structures

在框架结构中应用分布式面板荷载 Applying Distributed Panel Loads to Frame Structures 使用"Uniform to Frame"选项,可以简单地将荷载用于更多样化的情况。 With the “Uniform to Frame” option, loads can be easily used for a greater diversity of situat…

【书生·浦语大模型实战营第二期】学习笔记1

1. Introduction 开源llm举例:LLaMA 、Qwen 、Mistral 和Deepseek 大型语言模型的发展包括预训练、监督微调(SFT)和基于人类反馈的强化学习(RLHF)等主要阶段 InternLM2的显著特点 采用分组查询注意力(GQA…

蓝桥杯基础练习汇总详细解析(三)——字母图形、01字符串、闰年判断(详细解题思路、代码实现、Python)

试题 基础练习 字母图形 提交此题 评测记录 资源限制 内存限制:256.0MB C/C时间限制:1.0s Java时间限制:3.0s Python时间限制:5.0s 问题描述 利用字母可以组成一些美丽的图形,下面给出了一个例子&#…

web开发发展历程-前端、后端、消息队列、后端架构演进

文章目录 摘要主要内容不同的时代对应不同的技术前端技术的中间阶段-单页面应用前后端分离后端技术演化-云计算平台总体趋势反应式编程 消息队列发展史kafka,rocketmq,pulsar网易后端架构演进架构瓶颈数据库瓶颈服务器瓶颈数据库缓存瓶颈-缓存击穿、雪崩…

Spring Boot:Web开发之三大组件的整合

Spring Boot 前言Spring Boot 整合 ServletSpring Boot 整合 FilterSpring Boot 整合 Listener 前言 在 Web 开发中,Servlet 、Filter 和 Listener 是 Java Web 应用中的三大组件。Servlet 是 Java 代码,通过 Java 的 API 动态的向客户端输出内容。Filt…