从vue小白到高手,从一个内容管理网站开始实战开发第三天,使用Element UI构建页面-登录(一)

news2024/11/25 10:41:17

上次我们介绍了如何安装Element UI库,这次我们使用Element UI中的组件开始开发我们的页面。

开发之前要先在项目中建立好几个目录,方便我们下面的开发。

一、在项目中创建页面管理目录

1、pages目录(文件夹)

首先在src文件夹下创建一个名为pages的文件夹,该文件夹用来统一存放项目的所有页面,这样方便后期的开发、管理和维护

 让后在pages文件夹分别创建,login文件夹、home文件夹、error文件夹以及article文件夹

 2、login目录(文件夹)

login文件夹用来存放后台登录页面

3、home目录(文件夹)

home文件夹用来存放登录后的管理页面

4、error目录(文件夹)

error文件夹是用来存放用于错误的友好提示页面

5、article目录(文件夹)

article文件夹是用来存放内容管理页面的(发布文章、修改文章、删除文章、审批文章等)。

二、vue-cli项目中assets、components、app.vue、main.js的作用

介绍到这里,顺便介绍一下src文件夹下其他两个文件夹(assets、components)以及文件app.v

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

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

相关文章

elasticsearch的查询方式和数据库事务隔离级别的思考

项目中用到了 elasticsearch,发现有几种查询方式不太一样,思考了一下,总结如下 普通分页 等同于关系数据库的分页查询,例如 mysql 的 limit,如下 sql select * from test limit 100000,10 这种查询方式有一个问题&a…

软文推广宣发遵循的基本流程

在软文发稿的旅程中,制定明确的策略思路是确保成功的关键。软文发稿有一定的流程需要我们遵循,才能达到理想的软文宣发效果。首先,我们要明确发稿的地区,然后精准选择目标受众,最后才能展开内容的创作。下面&#xff0…

springboot整合springbatch批处理

springboot整合springbatch实现批处理 简介项目搭建步骤 简介 项目搭建 参考博客【场景实战】Spring Boot Spring Batch 实现批处理任务,保姆级教程 步骤 1.建表 建表sql CREATE TABLE student (id int NOT NULL AUTO_INCREMENT,name varchar(100) NOT NULL C…

02-SpringCloud-Eureka注册中心

Eureka注册中心 假如我们的服务提供者user-service部署了多个实例,如图: 大家思考几个问题: order-service在发起远程调用的时候,该如何得知user-service实例的ip地址和端口?有多个user-service实例地址,…

力扣hot100 翻转二叉树 递归

👨‍🏫 题目地址 😋 AC code /*** Definition for a binary tree node.* public class TreeNode {* int val;* TreeNode left;* TreeNode right;* TreeNode() {}* TreeNode(int val) { this.val val; }* TreeNod…

CNN——AlexNet

1.AlexNet概述 论文原文:ImageNet Classification with Deep Convolutional Neural Networks 在LeNet提出后,卷积神经网络在计算机视觉和机器学习领域中很有名气。但卷积神经网络并没有主导这些领域。这是因为虽然LeNet在小数据集上取得了很好的效果&am…

jQuery常用的 四大基本选择器

文章目录 简介:基础选择器1. 通过 ID 选择器获取元素2. 通过 class 选择器获取元素3. 通过标签名选择器获取元素 层级选择器1. 通过直接子元素选取2. 通过后代元素选取 属性选择器1.[attributevalue]属性选择器2.[attribute!value] 属性选择器3.[attribute*value]属…

如何在Windows安装Wnmp服务并实现固定地址远程访问

文章目录 前言1.Wnmp下载安装2.Wnmp设置3.安装cpolar内网穿透3.1 注册账号3.2 下载cpolar客户端3.3 登录cpolar web ui管理界面3.4 创建公网地址 4.固定公网地址访问 前言 WNMP是Windows系统下的绿色NginxMysqlPHP环境集成套件包,安装完成后即可得到一个Nginx MyS…

字符串处理-第11届蓝桥杯省赛Python真题精选

[导读]:超平老师的Scratch蓝桥杯真题解读系列在推出之后,受到了广大老师和家长的好评,非常感谢各位的认可和厚爱。作为回馈,超平老师计划推出《Python蓝桥杯真题解析100讲》,这是解读系列的第26讲。 字符串处理&#…

Typescript---webpack和Babel的使用 03

webpack 通常情况下,实际开发中我们都需要使用构建工具对代码进行打包,TS同样也可以结合构建工具一起使用,下边以webpack为例介绍一下如何结合构建工具使用TS。 步骤: 初始化项目 进入项目根目录,执行命令 npm init -…

Dockerfile + harbor详解

Dockerfileharbor私服 一 docker工作流 1. docker管理流程 2. 镜像仓库阿里 (1) 阿里私有仓库 公司内部管理项目涉及到的所有docker镜像,会使用私有仓库的方式,集中管理。 (2) 创建阿里Docker仓库 登录阿里云创建私有仓库 网址:容器镜像服…

希亦、觉飞、小吉三款婴儿洗衣机大比拼!全方位对比测评

由于年龄幼小的婴儿的皮肤都非常的幼嫩,因此婴儿衣物材质的类型大部分都是采用为纯棉,并且婴儿的衣物不能够与大人的衣物一起进行混洗,容易把细菌感染到宝宝的衣物上,因此很多家庭为了保证宝宝衣服的有效清洁,避免交叉…

感恩客户·持续向上-契约锁电子签章

2023年,电子签章成为组织数字化建设中的刚性需求,市场机遇帮助契约锁实现了产品、伙伴、客户、应用场景等全方位的持续发展。 感恩客户和伙伴的支持,让契约锁在2023年不断成长和进步。 感恩客户相伴成长 2023年,契约锁为“政府机关…

IDEA 控制台中文乱码问题解决方法(UTF-8 编码)

设置 IDEA 编码格式 1:打开 IntelliJ IDEA>File>Setting>Editor>File Encodings,将 Global Encoding、Project Encoding、Default encodeing for properties files 这三项都设置成 UTF-8 2:将 vm option 参数改为: -…

os.path.join(a,b)末尾出现\问题

文章目录 问题描述解决 问题描述 config[save_path] dataset/data/output 并且 config[model_name] (空字符串) os.path.join() 函数在处理路径时会正确处理路径分隔符,并避免出现多余的斜杠。但是,如果 config[‘save_path’]…

Linux进程以及计划任务

一.程序和进程以及线程 内核功用:进程管理、内存管理、文件系统、网络功能、驱动程序、安全功能等 对于所有的操作系统,都有基本的功能 1.程序 保存在硬盘、光盘等介质中的可执行代码和数据(硬盘上躺着) 静态保存的代码 执行…

MongoDB—SQL到MongoDB映射图表

一、术语和概念 下表显示了各种 SQL 术语和概念 以及相应的 MongoDB 术语和概念。 SQL Terms/Concepts MongoDB Terms/Concepts database database table collection row document or BSON document column field index index table joins $lookup, embedded docu…

ssm基于echarts的基金交易网站的设计与实现论文

摘 要 计算机网络发展到现在已经好几十年了,在理论上面已经有了很丰富的基础,并且在现实生活中也到处都在使用,可以说,经过几十年的发展,互联网技术已经把地域信息的隔阂给消除了,让整个世界都可以即时通话…

C语言中指针变量如何使用

一、指针变量的定义与声明 1.1 定义 指针变量是用来存储另一个变量的内存地址的变量。在C语言中,指针变量的类型是指向某个类型的指针。例如,int *p; 表示一个整型指针变量p。 1.2 声明 指针变量的声明分为两种形式,一种是直接声明&#…

什么是数据同步?为什么它很重要?

您的员工经常在不同的应用程序中查看同一组数据。 营销人员可能会在营销自动化平台中查看潜在客户,销售可能会在 CRM 中查看它们; HR 团队可能会在人力资源信息系统中跟踪员工信息,而 IT 可能会在项目管理系统中跟踪信息;财务团队…