vue面试题由浅入深(二)

高级特性

1、 如何自定义v-model

在子组件中

<template>
	<input type="text"
	:value="txt"
	@input="$emit('change',$event.target.value)"
	>
</template>
<script>
export default{
	model:{
		prop:text,
		event:'change'
	},
	props:{
		text:String
	}
}
</script>

在父组件中

<template>
	<text>{{ name }}</text>
	<chilren v-model="name"></chilren>
</template>
<script>
export default{
	compotents:{
		chilren 
	},
	data:{
		name:'123'
	}
}
</script>

2、 $ nextTick

将回调延迟到下次 DOM 更新循环之后执行。在修改数据之后立即使用它,然后等待 DOM 更新

3、动态、异步组件
用法 :is=“component-name”

<template>
<compontent :is="abc"></compontent>
</template>
<script>
export default{
	compotents:{
		chilren ,
		fromdamo:()=> improt('../../fromdamo') //异步导入组件,只有当使用到组件的时候才会引入
	},
	data:{
		abc:'chilren'
	}
}
</script>

4、keep-alive

包裹动态组件时,会缓存不活动的组件实例,而不是销毁它们。和 相似, 是一个抽象组件:它自身不会渲染一个 DOM 元素,也不会出现在组件的父组件链中。
当组件在 内被切换,它的 activated 和 deactivated 这两个生命周期钩子函数将会被对应执行。
activated () 当组件激活时调用
deactivated () 当组件失活时调用

5、mixin

可以把多个组件相同的逻辑给抽离出来,但是mixin并不是完美的解决方案,会有一些问题。
vue3.0 提出的composition API 旨在解决这些问题

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值