条件编译

视图层

<template>
    <!-- #ifdef  H5  -->   // 仅仅只在 H5 页面显示
    <view class="btn-box" v-bind:style="{color:color}" v-on:click="open">
        <slot></slot>
    </view>
    <!-- #endif -->
</template>
----------------------  #ifndef 
<template>
    <!-- #ifndef  H5  -->   // 仅不在 H5 页面显示
    <view class="btn-box" v-bind:style="{color:color}" v-on:click="open">
        <slot></slot>
    </view>
    <!-- #endif -->
</template>

业务逻辑层

<script>
    export default {
        props: {
            color: {
                type: String,
                dafult: '#000'
            }
        },
        data() {
            return {}
        },
        methods: {
            // #ifdef  H5       // 仅仅只在 H5 页面运行
            open() {
                console.log(' btn 被点击了')
                this.$emit('AAA', this.color)
            }
            // #endif
        }
    }
</script>

样式层

<style>
    /* #ifdef  H5 */
    .btn-box {
        width: 200px;
        height: 200px;
        border: red solid 1px;
        line-height: 100px;
        text-align: center;
    }
    /* #endif */
</style>