Resuelva el método de herencia por lotes de propiedades, métodos y ranuras al encapsular componentes Vue dos veces en Vue2.x

Pregunta: Un pequeño socio me preguntó si existe un método para la herencia por lotes al encapsular componentes dos veces en la versión Vue2.x;

Descripción: Al discutir el problema hoy, un pequeño socio de nuestra empresa habló sobre el problema de heredar propiedades al encapsular los componentes de IView dos veces. Los escribió uno por uno. Me sorprendió cuando lo descubrí, porque era demasiado problemático. y además En Vue2.x, la función de herencia por lotes se proporciona oficialmente, y el uso no puede considerarse como un método extraño;

<xxx-xxx
    :columns="columns"
    resizable
    show-overflow
    border
    stripe
    height="auto"
    :data="data"
>
</xxx-xxx>

Solución: Para los componentes de empaque secundario, hay tres voluntarios que deben heredarse en lotes, atributos, métodos y ranuras. Estos tres son los más necesarios, de la siguiente manera:

herencia de propiedad

<xxx-xxx v-bind="$attrs">
</xxx-xxx>

herencia de métodos

<xxx-xxx v-on="$listeners">
</xxx-xxx>

Herencia
de tragamonedas Las tragamonedas son especiales, y no existe un método directo proporcionado por el oficial, pero no nos impide usar algunas técnicas, como las siguientes

<xxx-xxx>
	<template v-for="(index, name) in $slots" :slot="name">
		<slot :name="name" />
	</template>
</xxx-xxx>

De esta manera, se puede completar la herencia por lotes de propiedades, métodos y ranuras. Vale la pena señalar que esto es aplicable a la versión Vue2.x de Vue, que no es completamente aplicable en Vue3. Por ejemplo, $listeners se eliminó en Vue3 ., necesita atención;

Supongo que te gusta

Origin blog.csdn.net/zy21131437/article/details/123351677
Recomendado
Clasificación