Solve the method of batch inheritance of properties, methods and slots when encapsulating Vue components twice in Vue2.x

Question: A small partner asked me if there is a method for batch inheritance when encapsulating components twice in the Vue2.x version;

Description: When discussing the problem today, a small partner in our company talked about the problem of inheriting properties when encapsulating the components of IView twice. He wrote them one by one. I was shocked when I found out, because it was too troublesome, and besides In Vue2.x, the function of batch inheritance is officially provided, and the usage cannot be regarded as a strange method;

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

Solution: For secondary packaging components, there are three volunteers that need to be inherited in batches, attributes, methods, and slots. These three are the most needed, as follows:

property inheritance

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

method inheritance

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

Slot inheritance
Slots are special, and there is no direct method provided by the official, but it does not prevent us from using some techniques, as follows

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

In this way, you can almost complete the batch inheritance of properties, methods and slots. It is worth noting that this is suitable for Vue2.x version of Vue, which is not fully applicable in Vue3. For example, $listeners was removed in Vue3. , need attention;