该项目位于 ，是一个基于 Vue.js、Element UI 和 FastAPI 的现代化后台管理系统模板。它旨在为开发人员提供一个快速启动新项目的平台，帮助节省时间和精力，以便专注于业务逻辑和创新。项目简介Vue-Element-Admin-FastAPI 结合了前端 Vue.js 框架与后端 FastAPI 的高性能特性，利用 Element UI 提供美观易用的组件库。它的核心功能包括用户认
ElementUI 作为当前运用的最广的 Vue PC 端组件库，很多 Vue 组件库的架构都是参照 ElementUI 做的。作为一个有梦想的前端（咸鱼），当然需要好好学习一番这套比较成熟的架构。目录结构解析首先，我们先来看看 ElementUI 的目录结构，总体来说，ElementUI 的目录结构与 vue-cli2 相差不大：.github：存放贡献指南以及 issue、PR 模板，这些是一
转载
2024-03-27 09:34:54
210阅读
项目中使用element-ui时，message弹框功能是必须使用的，有时会在点击按钮时提示无权限，或者请求报错时给出适当提示：但是重复点击按钮或者同一个页面多个请求同时报错时，就不美观了可以看到，element-ui是动态往页面根节点插入message元素来实现弹框效果的，都拥有el-message属性那么我们就可以通过判断页面中message的个数来决定要不要弹出第二个提示框这就需要重新写一下
转载
2024-07-05 15:03:30
494阅读
Element-UI登录页实现src/main.js// The Vue build version to load with the `import` command
// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
import Vue from 'vue'
import App f
转载
2024-07-26 09:35:42
64阅读
1.添加工具类：dialogDrag.js import Vue from 'vue' // v-dialogDrag: 弹窗拖拽 Vue.directive('dialogDrag', { bind (el, binding, vnode, oldVnode) { const dialogHead ...
转载
2021-09-29 10:03:00
98阅读
2评论
Vue学习笔记 – Vue的响应式原理今天通过王红元老师的教学视频和一些博主的技术分享，学习了Vue的响应式原理，话不多说直接进入正题这是Vue官网中提供的响应式原理示意图，总结起来我们最常见到的响应式原理的答案就是：使用Object.defineProperty将所有属性使用setter和getter进行劫持，在读取数据和写入数据时进行拦截处理这是我自己总结的响应式流程：然而这只是响应式原理中的
同事给到我一个新的需求，其中包括一个上传的图片列表的顺序调整功能，还需要通过拖拽图片实现调序，简单实现这个功能，并做一个记录环境：Vue3 + element-ui，在组件el-upload中的多文件上传列表中实现，先上运行图，动图演示功能符合你的需求，你就接着往下看，不符合也节约你的时间直接上源码吧，先是上布局部分<el-upload
v-model:file-list="fi
转载
2024-10-31 08:16:14
83阅读
当对话框的“×号”和 取消按钮都想调用同个消息提示关闭函数时，使用@close出现错误问题会出现，你点取消后触发一次消息提示，然后你点确定关闭后，会再次触发对话框的close事件，这样你就会两次有消息提示了。原因由于你点取消的时候出现消息提示后，点击“确定”，即会关闭弹窗，所以会触发@close事件解决方式可以通过这样解决：<el-dialog
title="修改摄像
转载
2024-05-05 17:48:52
265阅读
目录前言一、新建首页页面1.新建首页二、引入路由1.引入vue-router2.全局引入router3.运行页面总结前言 随着框架的流行，越来越多的开发者喜欢用框架开发项目，以vue、react等居主流，国内比较常用的就是vue进行项目的搭建，本系列文章主要使用vue+webpack进行项目的搭建，其中使用了elementUI进行了扩展，增加到后台系统的布局和路由相关知识，有兴趣就往下看吧~一、新
转载
2024-03-07 16:29:37
144阅读
写在开头上一篇文章 ElementUI源码系列三 - 学习gen-cssfile.js文件之自动创建组件的.scss文件与生成index.scss文件内容 我们讲过添加一个新组件要经历三个步骤：第一步 - 创建组件目录结构第二步 - 创建组件样式文件第三步 - 总入口文件引入组件并且我们实现了第二步的自动创建操作，也就是仅通过命令即可完成创建文件，再也不需要手动创建操作。当然，这第二步还不够高级，
转载
2024-07-03 23:13:10
48阅读
前言：本篇博客主要介绍了前端页面的一些消息提示框，均是element-ui中的组件，查找起来比较方便。详细文档可以查看element-ui官网：Element-uiMessage消息提示框用来显示不同状态的提示框(不可手动点击关闭)// 显示成功的操作
this.$message({
message: '恭喜你，这是一条成功消息',
type: 'succe
转载
2024-03-22 15:38:18
712阅读
问题：Element-UI 作为当前较为成熟的 Vue 框架的 UI 组件，能有效的提高特异性不强的项目的界面开发。但是，作为一个要兼备处理多方面问题的第三方库，Element-UI 也存在着一些问题。比如 <el-dialog>。在引用 <el-dialog> 时，尤其是将其作为编辑弹窗时，常常会有一个问题，便是在使用鼠标滑动选取弹窗中做文本选择时，若不注意将光标滑到弹窗
转载
2024-05-03 19:51:49
1284阅读
修改style样式 但是由于scope只能修改当前组件样式，所以去掉scope<style>
.el-dialog__header {
background: #002a52;
text-align: center;
}
.el-dialog__title {
color: aliceblue;
}
</style>我们可以F12 
转载
2024-02-24 07:43:56
535阅读
讲解 组件.vue 使用组件
原创
2022-09-01 17:09:32
335阅读
移动端导读移动端适配，是我们在开发中经常会遇到的，这里面可能会遇到非常多的问题：1px 问题UI 图完美适配方案iPhoneX 适配方案高清屏图片模糊问题…接下来我们从移动端适配的基础概念出发，探究移动端适配各种问题的解决方案和实现原理一、英寸一般用英寸描述屏幕的物理大小，如电脑的 13、16，手机显示器的 4.8、5.7 等使用的单位都是英寸。需要注意，上面的尺寸都是屏幕对角线的长度： 英寸(i
element ui 对话框el-dialog关闭事件详解通常会有需求，在关闭弹框后需要清空填写的数据，这时候就需要关闭事件了在标签中加入@close='closeDialog'mothods中加入//关闭弹框的事件closeDialog(){this.xxx = '';//清空数据},以上这篇element ui 对话框el-dialog关闭事件详解就是小编分享给大家的全部内容了，希望能给大家一
转载
2024-04-25 23:05:51
601阅读
今天由于项目需要，想在Tree组件的前面增加一个icon图标，根据不同类型增加不同的图标，我修改了elementUI的源代码，发布到npm上去成功使用，记录下过程中所碰到的问题，首先看下最后的效果：下面简单记录下过程和过程中所遇到的问题以及问题的解决方案。首先把elementUI的项目从git上克隆下来：git clone https://github.com/ElemeFE/element.gi
转载
2024-04-17 19:45:55
151阅读
由于面试需要，先来几发 element 源码学习博客。Vue 源码还将继续更新。
好，现在我们开始学习 element —— 最受欢迎的 Vue UI 框架。package.json我觉得要看一个前端项目，首先必须得看看 package.json 这个文件。编译入口来看看编译的入口"scripts": {
# 安装依赖
"bootstrap": "yarn || npm
目录1. Layout 布局 2. Container 布局容器 3. Color 色彩 4. Typography 字体 5. Icon 图标 6. Button 按钮汇总LayoutRow Attributes：参数说明类型可选值默认值gutter栅格间隔number—0type布局模式，可选 flex，现代浏览器下有效string——justifyflex 布局下的水平排列方式strings
转载
2024-03-22 12:34:25
209阅读
配置文件这里大致说一下开发过程中经常用到的配置 config/dev.env.js 这里是开发过程中需要修改的一个地方'use strict'
const merge = require('webpack-merge')
const prodEnv = require('./prod.env')
module.exports = merge(prodEnv, {
NODE_ENV: '"de
转载
2024-04-24 14:42:19
95阅读
