slot 学习

子组件要写slot 来接受

<template>
    <div class='dealInterface' v-if="isShow" @click="switchStatus">
        <div class="dealInputInner">
            <slot></slot>
        </div>
        <div class="dealInputInner_one" v-if="!switchStyle">
            <slot></slot>
        </div>
    </div>
</template>

父组件上

<alertModel :is-show="alertModelShow" style="z-index: 200;">
                <div class="" style="font-family: '微软雅黑';font-size: 28px;color:#C30114;text-align: center; padding-top: 80px;">
                    最多选三支产品比对！
                </div>
                <div class="" style="text-align: center;margin-top: 80px;">
                <img style="cursor: pointer;" v-on:click="cancelHome" src="../../assets/images/confirm.png" />
                </div>
            </alertModel>

《slot》那一块 就会被替换成父组件里写的

<div class="" style="font-family: '微软雅黑';font-size: 28px;color:#C30114;text-align: center; padding-top: 80px;">
                    最多选三支产品比对！
                </div>
                <div class="" style="text-align: center;margin-top: 80px;">
                <img style="cursor: pointer;" v-on:click="cancelHome" src="../../assets/images/confirm.png" />
                </div>