您的位置:首页 > Web前端 > Vue.js

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"就是代表点击事件

 页面就变成了下面这个样子

 

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: 
相关文章推荐