提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档  文章目录前言一、vue+element table弹窗组件二、代码展示 1.表格数据展示 2.弹窗组件总结  前言本人爬虫菜鸟一枚,最近公司业务要求使用vue+flask搭建一个公司使用的后台管理系统,在此做个记录。也是本人第一次写博客,多多指点。 废话不多说...直捣黄龙,在表格数据展示经常需要有编
前言在某个月黑风高的晚上...没剧刷的我无意想起以前处理的一些弹窗的坑。然后又无意间刷到“Portal”,才知道Modal的实现还有如此妙的方式,顺而想着干脆把UI组件库的实现原理看完。本文将讲述以下三种 Modal弹窗类的实现原理:1. Modal弹窗的基本原理我给弹窗类的定义是脱离固定的层级关系,不再受制于层叠上下文的组件。常见的Modal模态框、Dialog对话框、Notification通
转载 2024-06-18 22:50:49
307阅读
1.实现效果图2.第一步,新建一个.vue文件 定义一个弹框的基本模板style样式放在了文章的最底部,如果需要看效果,需要将样式放入这个vue文件里 ,样式是用less写的,需要你的项目引入less 注意:我这里的组件右上角关闭是一张图片 需要换成你自己本地的路径<template> <div id="tip_alertModal"> <div cl
转载 2024-10-22 06:58:22
504阅读
目录一、HTML标签部分二、Script脚本部分1、引入所需API2、定义接收配置项3、定义Emit方法三、完整子组件代码四、父组件引用 Vue3和TypeScript前,本人开发工作中一直运用较多的技术框架就是Vue2和JavaScript了。在一次偶然的机会里接到一个基于Vue3+TypeScript的项目,才开始接触Vue3和TypeScript。于是花了差不多两周的时间去学习Vu
转载 2024-06-12 18:46:07
258阅读
1.安装 使用命令 npm i element-ui -S 安装element ui 安装sass加载器 cnpm i sass-loader -D 2.使用 在main.js加入如下代码 import Vue from 'vue'; import ElementUI from 'element-u ...
转载 2021-07-28 14:58:00
321阅读
2评论
2021.12.20 更新因为最近用 vue3 新写了一个官网类型的网站,当时也是有用 vue3 的模式写一个手动挂载的登录弹窗组件,但是也是为了写的比较满意使用的单例模式来做,之后发现之前这篇博文在介绍单例模式方面的写法是没有问题的,但是在举例 vue 单例弹窗应用的时候有一些细节没有介绍到。import Vue from 'vue' import loginPopupComponent fro
应产品的要求,做人生中的第一次换肤项目,在没做之前,确实觉得挺没有头绪的,所以就只能借助于百度啊,然后发现其实element自带的就有换肤功能,虽然看了很多别人的文章,但是想自己写一下加深印象。 一、项目搭建       第一步肯定是根据命令行生成对应的项目框架,然后安装element,根据需求引入自己需要的eleme
转载 2024-05-13 09:25:19
530阅读
当在 Element UI弹窗组件中打开另一个弹窗时,可能会出现多层遮罩的问题。这可能导致用户界面不友好,并且影响用户体验。为了解决这个问题,您可以尝试以下几种方法:设置遮罩层的 append-to-body 属性:在 Element UI 弹窗组件中,可以尝试设置 append-to-body 属性为 true。这样可以确保每个弹窗都被附加到 body 元素上,而不是在当前弹窗中。<e
原创 2024-09-06 16:23:36
318阅读
文章目录Vue(11)——vue+elementUI的简单使用1、创建工程2、配置环境3、编写vue组件4、配置路由5、开启路由6、展示组件7、测试8、运行时可能遇到的问题: Vue(11)——vue+elementUI的简单使用Element UI 是一套采用 Vue 2.0 作为基础框架实现的组件库,一套为开发者、设计师和产品经理准备的基于 Vue 2.0 的组件库,提供了配套设计资源,帮助
转载 2024-04-10 15:23:35
70阅读
1.本项目Demo实现灵感来源 张凯博客,采用vue+elementui实现编码,最终效果图:完整源码下载2.首先创建vue项目,采用开发工具Hbuilder。vue创建项目教程可参考:3.创建项目后安装elementui,按照官方教程即可   创建好的项目目录结构大概这样子: 4.项目头部和底部在整个项目中是共用的状态,使用vue的router-
在子组件中编写弹窗,在父组件中引用弹窗文章目录编写子组件编写父组件把子组件的弹窗引入到父组件中引入子组件方法注册子组件通过$emit把子组件的值传入到父组件中父组件接收子组件传来的值通过v-if条件确定数据的显示与隐藏整体代码参考 编写子组件效果图: 代码:<template> <ModalComponent name="import-set" title="
转载 2024-02-23 11:22:27
524阅读
# 如何实现 Vue Element UI Admin ## 前言 欢迎来到Vue Element UI Admin的世界!本文将教会你如何快速搭建一个基于Vue.js和Element UI的后台管理系统。在整个过程中,我们将使用Vue CLI脚手架工具来初始化项目,并结合Element UI组件库来构建页面布局和功能。 ## 步骤概览 让我们先来看看整个实现过程的步骤概览,如下表所示: |
原创 2024-05-22 11:29:32
78阅读
Vue集成Element UIElement UI后台管理系统主要的标签el-container:构建整个页面
原创 2022-08-03 17:15:52
335阅读
Input Attributes 参数说明类型可选值默认值 type 类型 string text,textarea 和其他 原生 input 的 type 值 text value / v-model 绑定值 strinnu
原创 2023-10-08 10:43:26
32阅读
电商项目 Vue的学习过程中,做了这个电商项目练习,在做的过程中做了如下一些笔记,本项目主要用到是 Vue + element-ui框架快速成型.由于还未学习服务器部署等技术,项目只能在本地运行.项目笔记如下.创建工程vue create vue_shop rd/s/q 强制删除运行工程npm run serve删除多余组件内容关闭eslinet打开package.json 用下面替换 "esli
转载 2024-05-11 16:04:03
76阅读
http://element-cn.eleme.io/#/zh-CN/component/quickstart饿了么element.ui官网vue 封装element-ui
原创 2023-05-12 18:00:39
294阅读
 
原创 2021-05-25 18:00:39
476阅读
Form Attributes 参数说明类型可选值默认值 model 表单数据对象 object — — rules 表单验证规则 object — — inline 行内表单模式 boolt
原创 2023-10-08 10:46:57
223阅读
1.在package.json的dependencies字段下面增加"element-ui":"^1.3.4"这里的1.3.4是需要安装的那个版本。element-ui官网。2.cd项目目录3.npminstall看到如下结果manage@1.0.0/Users/xhdx/Desktop/pname└─┬element-ui@1.3.4├──async-va
原创 2018-03-20 01:11:51
2777阅读
打开vue项目所在的项目路径 输入 npm install element-ui -S 安装element ui 表示安装成功 在vue项目下的node_modules下会显示 element ui 配置element ui 改变项目目录中的main.js文件; 初始main.js文件: impor
转载 2020-02-08 16:38:00
273阅读
2评论
  • 1
  • 2
  • 3
  • 4
  • 5