原来写一个Vue主页就是这么简单
全栈修身:给我们的项目加个主页
你永远无法取代任何人。失去的就是失去的。每个人都是无可替代的,失去的就是失去的。前言上一篇文章使用vueui创建项目kola,开源代码如下:github:https://github.com/zhangyunan...gitee:https://gitee.com/zhangyunan1...中这篇文章,我们继续入手,先添加一个项目的首页和登录页面,暂时不和后台交互。登录后的后台功能页面没问题。这里是一个公共主页,主要是介绍项目。一般首页都比较高大上,但是后台管理系统的风格一般比较简单。顶层和底层结构Header一般放项目或者公司logo,常用的也会有首页,功能,关于等常用操作。主要会加入一些高端的宣传图片、文案、数据。上、中、下结构Header一般包含项目或企业标识。常见的还有首页、功能、关于。运营方面,主营会添加一些高端的宣传图片、文案、数据。Footer会写一些版权信息,服务条款,公司地址,还有一些方便的站点地图。剩下的就是各种花哨的主页了。对于一个后端管理项目,我们使用第二种方案吧!关于首页,可以找专门的前端小姐姐和大哥来设计,也可以直接去那种前端模板首页找模板,修改公共首页,因为用的是elementui,在它提供的容器布局中,已经提供了相应的解决方案,第二个是
HeaderMain页脚0。首先启动我们的项目,运行yarnserve,这样修改的时候可以保持热部署,可以实时看到修改结果,启动后会提示地址。在浏览器打开可以直接看到vue默认配置1、修改标题,修改文件public/index.html这里我们修改首页的标题和样式,把
3.修改Home组件我们查看路由配置可以看到importHomefrom'../views/Home.vue'constroutes=[{path:'/',name:'Home',component:Home}]where'/'会匹配Home组件,因为我们上面清除了App.vue中的所有内容,所以首页显示的内容来自于Home,这里我们开始修改src/views/Home.vue文件。第一步是删除HelloWorld的使用,删除该文件,并删除img。