vue总结

常见指令directive

(一)、插值指令
	{{ key }}
	v-text
	v-html
	v-bind
		1、动态属性绑定
		2、v-bind简写
		3、class样式处理
			1>对象语法 Truthy真值
			2>数组语法
		4、style样式处理
			1>对象语法
			2>数组语法

	javascript表达式
(二)、流程控制指令
	条件渲染
		1、v-show
		2、v-if
			template标签上使用v-if
			用 key 管理可复用的元素
		3、v-show 和 v-if 的区别 
	列表渲染
		1、数字循环
		2、对象循环
		3、数组循环
		4、在 template标签上使用v-for
		5、v-for 与 v-if 一同使用
		6、状态维护
(三)、事件绑定v-on
	监听事件
	事件处理方法
	内联处理器中的方法
	事件修饰符
		1、.stop
		2、.prevent
		3、.capture
	键盘修饰符
		1、.enter
		2、.tab
		3、.esc
		4、.space
	系统修饰符
		1、.ctrl
		2、.alt
		3、.shift
		4、.meta
		5、.exact
	双向绑定v-model
		文本框
		多行文本框
		复选框
		单选框
		下拉选择框
		修饰符
			1、.lazy
			2、.number
			3、.trim
	自定义指令
		全局定义/局部定义
		钩子函数
			1、 bind
			只调用一次,指令第一次绑定到元素时调用。
			在这里可以进行一次性的初始化设置
			2、 inserted
			被绑定元素插入父节点时调用
		 	仅保证父节点存在,但不一定已被插入文档中
		    3、 update
		    所在组件的 VNode 更新时调用
		    4、 componentUpdated
		    指令所在组件的 VNode 及其子 VNode 全部更新后调用
		    5、 unbind
			只调用一次,指令与元素解绑时调用
	钩子函数参数

生命周期lifetime

侦听器watch

在数据变化时执行异步或开销较大的操作时、可以采用 watch监听响应式数据

计算属性computed

计算属性的 setter
计算属性缓存 vs 方法
计算属性缓存 vs 侦听器

过滤器filter

组件component

组件定义
组件传值
	父向子组件传值
	子向父组件传值
	其他组件间传值
动态组件
插槽
	插槽内容
	后备内容
	具名插槽
	作用域插槽
	动态插槽名
	独占默认插槽
边界处理
	$root
	$parent
	$children
	$refs
	$slots

路由VueRouter

路由安装及定义
路由名称
动态路由
    1、响应路由参数的变化
	2、通配符*定义路由
	3、404not found路由
	4、高级匹配模式path-to-regexp
	5、同一个路径可以匹配多个路由
		匹配优先级谁先定义的,谁的优先级就最高
子路由
	子路由的定义
	子路由渲染
路由导航
	声明式导航
	编程式导航
	$router 和 $route
重定向和别名
	字符串
	对象
	函数
	别名
命名视图
路由组件传参
	布尔模式
	对象模式
	函数模式
路由模式
路由守卫
	全局守卫
		全局前置守卫
		全局解析守卫
		全局后置钩子
	路由独享守卫
	组件内守卫
	导航解析流程
	路由元数据meta
	路由懒加载
常见问题
Vue中报错: Uncaught (in promise) Error:Redirected when going from “x“ to “x“ via a navigation guard



路由管理器中添加如下代码:
const originalPush = VueRouter.prototype.push;
VueRouter.prototype.push = function push(location) {
	return originalPush.call(this, location).catch(err => err)
}
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值