vue.js基础(5)

什么是路由

1.对于普通的网站,所有的超链接都是URL地址,所有的URL地址都对应服务器上对应的资源
2.对于单页面应用程序来说,主要通过URL中的hash(#号)来实现不同页面之间的切换,同时hash有一个特点:HTTP请求中不会包含hash相关 的内容,所以,单页面程序中页面跳转只要用hash实现
3.在单页面应用程序中,这种通过hash改变来切换页面的方式,称作前端路由(区别于后端路由)

在Vue中使用vue-router

1.导入vue-router组件类库
2.使用router-link组件来导航
3.使用router-view组件来显示匹配到的组件
4.创建使用vue.extend创建组件
5.创建一个卤藕router实例,通过routers属性来定义路由匹配规则
6.使用router属性来使用路由规则




	
		
		
		
		路由的基本使用
		
		
		
		
	

	
		
登录组件 注册组件

在路由规则中定义参数




	
		
		
		
		路由规则中定义参数
		
		
	

	
		
登录 注册



	
		
		
		
		路由的基本使用
		
		
		
	

	
		
登录 注册

使用children属性实现路由嵌套




	
		
		
		
		路由的嵌套
		
		
	

	
		
account

vue.js基础(5)_第1张图片

命名视图实现经典布局




	
		
		
		
		命名视图经典布局
		
		
		
	

	
		

vue.js基础(5)_第2张图片

watch 的使用

姓-名之间的监听




	
		
		
		
		名称案例
		
	

	
		
+ + =

watch、computed和methods之间的对比

1.computed属性的结果会被缓存,除非依赖的响应式属性变化才会重新计算。主要当作属性来使用
2.methods方法表示一个具体的操作,主要书写业务逻辑
3.watch有一个对象,键是需要观察的表达式,值是对应回调函数。主要用来监听某些特定数据的变化,从而进行某些具体的业务逻辑操作,可以看作是computed和methods的结合体
在这里插入图片描述

你可能感兴趣的:(vue,vue)