vue_cli下开发一个简单的模块权限系统之建立登录页面并且实现在浏览器输入地址出现内容
2017-09-22 17:32
821 查看
新建一个Login.vue(登录页面,先把Hello.vue的内容复制过来即可)
然后我们打开router下面的index.js,第一个箭头:(引入vue路由)第二个箭头(引入我们新建的Login.vue页面)第三个箭头(我们要使用这个路由)第四个箭头(配置路由,path表示在浏览器中输入的路由名称)
然后我们在浏览器中输入这个login页面的地址,就会出来内容了,这样一个简单的页面就建成了
因为我们要使用semantic-ui,所以我们安装一下semantic-ui,进入到命令行界面输入npm install semantic-ui,等待安装完成即可
安装完成以后我们需要在main.js里面引入一下,这样我们就可以使用semantic-ui了
然后我们修改一下login.vue,用semantic搞一个简单的登录页面v-model就是标识这个输入框,v-on:click="doLogin"就是代表点击事件
页面就变成了下面这个样子
相关文章推荐
- vue_cli下开发一个简单的模块权限系统之实现登录
- vue_cli下开发一个简单的模块权限系统之展现数据
- ASP.NET Core 打造一个简单的图书馆管理系统(三)基本登录页面以及授权逻辑的建立
- ASP.NET Core 打造一个简单的图书馆管理系统 (修正版)(二)用户数据库初始化、基本登录页面以及授权逻辑的建立
- 一个小型的网站,比如个人网站,可以使用最简单的html静态页面就实现了,配合一些图片达到美化效果,所有的页面均存放在一个目录下,这样的网站对系统架构、性能的要求都很简单,随着互联网业务的不断丰富,网站
- 简介 WatiN是一个开源的用于Web测试自动化的类库,从watir中获得的灵感,使用C#开发。WatiN通过与浏览器的交互来实现自动化,使用起来具有轻便,简单的特点。目前最新版本为2.0,加入了对
- 当打开浏览器,从在地址栏里输入一个URL开始,到出现整个页面,网络上都发生了什么事
- vue.js如何写一个简单的原生js模块,浏览器中的表现如何?
- 一个简单的利用ini配置文件以及用户输入的交互进行文件夹内容拷贝的批处理文件脚本的实现
- 借助cookie实现子网页修改父网页内容遇到的问题:同一个浏览器访问相同页面,会互相影响。 (已解决)
- 使用Vue.js和Element-UI做一个简单的登录页面
- 通用权限管理系统组件 (GPM - General Permissions Manager) 中后一个登录的把前一个登录的踢掉功能的实现
- 实现简单的输入编辑,录入正确的字符串,出现‘$’,表示撤销前一个输入, 发现连续的‘$’,表示连续撤销前面的输入;发现‘%’,表示放弃前面所有录入; 生成最终结果。
- 编写一个jsp程序,实现用户登录,当用户输入的用户或密码错误时,将页面重定向到错误提示页,并在该页面显示30秒后 自动回到用户登录界面
- 一个简单的学生登陆系统的jsp实现之登陆主页面main.jsp
- 系统通过浏览器后退到登录页面,然后禁止通过前进登录的实现
- yii2获取登录前的页面url地址--电脑和微信浏览器上的实现以及yii2相关源码的学习
- Vue.js如何写一个简单的原生js模块,浏览器中的表现如何?
- 【业务】Vue项目里利用md5的来实现一个权限系统的思路记录
- vue实现一个登录页面