vue.第六天

7.1 vue组件进阶

动态组件,切换

<component :is="变量">

变量中写组件的名字,点击事件切换组件的名字.

7.1.1 组件缓存

<keep-alive>

包裹切换的组件,使组件不会被销毁.

是一个标签,直接包裹

<keep-alive>

<component :is="变量">

</keep-alive>

7.1.2 组件激活和非激活

钩子函数:

激活:activated()

非激活: deactivated()

7.1.3 组件插槽

slot标签

组件内用slot占位

默认内容

在slort中写默认内容

7.1.4 具名插槽

slot使用name属性区分

<template v-slot:'name名'>

v-slot: 可以换成 #

#name

v-slot='name名'

7.1.5 作用域插槽

子组件,在slot上绑定属性和子组件内的值

使用组件,传入自定义标签,用template和v-slot'自定义书名'

使用场景

使用插槽,使用子组件变量的时候

子

<slot :row='obj'>

父

<template v-slot='str'>

{ {str.row.name}}

7.1.6 自定义指令 注册

全局

Vue.directive('指令名',{