app.vue
<template>
<c-test>
<c-cell value="12" useLabelSlot>
<text slot="label">
132
</text>
</c-cell>
<c-cell >123</c-cell>
<c-cell value="34">132</c-cell>
<c-cell value="45">123</c-cell>
<c-cell value="56">123</c-cell>
</c-test>
</template>
c-cell.vue
<template>
<view class="cell">
<view v-if="title || label || useTitleSlot || useLabelSlot" class="cell-title">
<slot name="title">
<text>{{title}}</text>
</slot>
<view v-if="label || useLabelSlot" class="cell-label">
<slot name="label">
<text>{{label}}</text>
</slot>
</view>
</view>
<view class="cell-value">
<slot>
<text>{{value}}</text>
</slot>
</view>
</view>
</template>
c-test.vue
<template>
<view>
<slot></slot>
</view>
</template>
<script>
export default {
mounted() {
this.$nextTick(() => {
this.getSlots();
})
},
methods: {
getSlots() {
console.log(this.$children)
}
}
}
</script>