详解windows下vue-cli及webpack 构建网站(四) 路由vue-router的使用
作者:安树 发布时间:2024-05-21 10:31:02
标签:vue,cli,router
windows下vue-cli及webpack 构建网站(一)环境安装
windows下vue-cli及webpack 构建网站(二)导入bootstrap样式
windows下vue-cli及webpack 构建网站(三)使用组件
1、本篇文章是建立在以上三篇文章的基础上的。
2、安装 vue-router 插件,运行cmd进入到项目目录下面,运行以下命令:
cnpm install vue-router --save-dev
3、在src文件夹下面新建一个文件夹page用于存放模板文件,然后分别在这个文件夹下面新建 index.vue、list.vue两个文件,然后打开index.vue粘贴以下代码:
<template>
<div class="jumbotron">
<h1>这里是首页!</h1>
</div>
</template>
保存之后再打开list.vue粘贴以下代码:
<template>
<div class="list-group">
<a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" class="list-group-item active">
这里是列表页
</a>
<a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" class="list-group-item">Dapibus ac facilisis in</a>
<a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" class="list-group-item">Morbi leo risus</a>
<a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" class="list-group-item">Porta ac consectetur ac</a>
<a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" class="list-group-item">Vestibulum at eros</a>
</div>
</template>
来源:http://blog.csdn.net/ansu2009/article/details/53321044
0
投稿
猜你喜欢
- 本文实例讲述了python通过pil将图片转换成黑白效果的方法。分享给大家供大家参考。具体分析如下:pil功能强大,convert方法可以轻
- 开发环境说明:python 3.6.2Vs studio 2017 (已经安装C++桌面开发)我的vcvarsall.bat 路径为:&qu
- 概念MySQL UNION 操作符用于连接两个以上的 SELECT 语句的结果组合到一个结果集合中。多个 SELECT 语句会删除重复的数据
- 搞一个图形化界面还是挺酷的,是吧 安装库什么的应该不用多说了吧。。一般来说会让你把 designer.exe(编辑图形化界面的东西,跟vb差
- 近期线上出现一个bug,研发的小伙伴把测试环境的地址写死到代码中,在上线前忘记修改,导致线上发布的代码中使用了测试环境地址。开发过程中虽然有
- 本次的7个python爬虫小案例涉及到了re正则、xpath、beautiful soup、selenium等知识点,非常适合刚入门pyth
- JS提供两个截取字符串的方法,分别是:slice()和substring()slice和substring都可以接受一个或两个参数,第1个参
- 1.图像读取使用cv2.imread(filepath,flags)读入图像filepath: 读入图像完整路径(绝对路径,相对路径)fla
- Web开发中,我们经常会遇到分页显示和排序数据记录集的情况,这在服务器端使用服务器端的代码和数据库技术是件很轻松的事情,比如:ASP、PHP
- 不论你是有着多年经验的 Python 老司机还是刚入门 Python 不久,你一定遇到过UnicodeEncodeError、Unicode
- 一、安装plotly库因为这部分内容主要是用plotly库进行数据动态展示,所以要先安装plotly库pip install plotly除
- 今天从网上学习了有关SQL注入的基本技能。SQL注入的重点就是构造SQL语句,只有灵活的运用SQL 语句才能构造出牛比的注入字符串。学完之后
- 本文介绍了Python日期的加减等操作的示例,分享给大家,也给自己留个笔记1. 日期输出格式化所有日期、时间的api都在datetime模块
- 从实时视频流中识别出人脸区域,从原理上看,其依然属于机器学习的领域之一,本质上与谷歌利用深度学习识别出猫没有什么区别。程序通过大量的人脸图片
- 进过两天的研究终于实现了cookie的免密登录,其实就是session。特别开心,因为在Python爬虫群里问那些大佬,可是他们的回答令我寒
- 一、迭代器迭代器就是iter(可迭代对象函数)返回的对象,说人话.......可迭代对象由一个个迭代器组成可以用next()函数获取可迭代对
- 1、确定服务器上的防火墙没有阻止 3306 端口 MySQL 默认的端口是 3306 ,需要确定防火墙没有阻止 3306 端口,否则远程是无
- 触发器权限和所有权CREATE TRIGGER 权限默认授予定义触发器的表所有者、sysadmin 固定服务器角色成员以及 db_owner
- 背景介绍Expect 程序主要用于人机对话的模拟,就是那种系统提问,人来回答 yes/no ,或者账号登录输入用户名和密码等等的情况。因为这
- 一、问题故事起源于一个查询错漏率的报表:有两个查询结果,分别是报告已经添加的项目和报告应该添加的项目,求报告无遗漏率何为无遗漏?即,应该添加