示例代码：

页面

<template>  
    <view class="container">  
        <button type="default" @click="onClickShowPicker('tx')">变速器</button>  
        <button type="default" @click="onClickShowPicker('trade_type')">交易方式</button>  
        <CarSelectPicker v-model="form.tx" :options="pickerOptions.tx" :visible.sync="pickerVisible.tx"></CarSelectPicker>  
        <CarSelectPicker v-model="form.trade_type" :options="pickerOptions.trade_type" :visible.sync="pickerVisible.trade_type"></CarSelectPicker>  
    </view>  
</template>  

<script>  
import CarSelectPicker from '@/components/car/car-select-picker.vue';  
export default {  
    components: {  
        CarSelectPicker  
    },  
    data() {  
        return {  
            form: {  
                images: [],  
                certs: [],  
                license_at: '',  
                tx: '',  
                trade_type: '',  
            },  
            pickerOptions: {  
                tx: [  
                    {label: '手动挡', value: 0},  
                    {label: '自动挡', value: 1},  
                ],  
                trade_type: [  
                    {label: '上门交易', value: 0},  
                    {label: '到店交易', value: 1},  
                ]  
            },  
            pickerVisible: {  
                license_at: false,  
                tx: false,  
                trade_type: false,  
            },  
        };  
    },  
    methods: {  
        /**  
         * 显示选择框  
         * @param {Object} key  
         */  
        onClickShowPicker(key) {  
            let _ = this  
            _.pickerVisible[key] = true  
        },  

    }  
};  
</script>  

<style></style>  

组件

<template>  
    <view style="position: fixed;top: 0;left: 0;width: 750upx;height: 100%;z-index: 91;" v-if="visible">  
        <view style="position: absolute;top: 0;left: 0;width: 750upx;height: 100%;z-index: 92;background-color: #000000;opacity: 0.6;" @click="onClickCancel"></view>  
        <view style="position: absolute;bottom: 0;left: 0;width: 750upx;height: 582upx;z-index: 93;">  

            <!-- 按钮栏 -->  
            <view class="uni-column" style="border-bottom: 1px solid rgb(232 232 232);border-top: 1px solid rgb(232 232 232);background-color: #FFFFFF;">  
                <view class="uni-row" style="height: 80upx;margin: 0upx 40upx;align-items: center;justify-content: space-between;font-size: 28upx;">  
                    <view style="color: rgb(177 177 177);" @click="onClickCancel">取消</view>  
                    <view style="color: rgb(0, 122, 255);" @click="onClickConfirm">确认</view>  
                </view>  
            </view>  

            <!-- 选择区 -->  
            <picker-view @change="onClickChange" :value="[index]" style="height: 500upx;background-color: #f1f1f1;">  
                <picker-view-column style="text-align: center;">  
                    <view v-for="(v, i) in options" :key="i">{{ v.label }}</view>  
                </picker-view-column>  
            </picker-view>  

        </view>  
    </view>  
</template>  

<script>  
    export default {  
        model: {  
            prop: 'value',  
            event: 'change'  
        },  
        props: {  
            options: Array,  
            visible: {  
                type: Boolean,  
                default: false,  
            }  
        },  
        data() {  
            return {  
                index: 0,  
            }  
        },  
        methods: {  

            /**  
             * 选择  
             * @param {Object} e  
             */  
            onClickChange(e) {  
                let _ = this  
                _.index = e.detail.value[0]  
            },  

            /**  
             * 取消  
             */  
            onClickCancel() {  
                let _  = this  
                _.$emit("update:visible", false)  
            },  

            /**  
             * 确认  
             */  
            onClickConfirm() {  
                let _ = this  
                let i = _.index  

                if(_.options[i]) {  
                    _.$emit('change', _.options[i].value);  
                } else {  
                    _.$emit('change', _.options[0].value);  
                }  
                _.$emit("update:visible", false)  
            },  
        }  
    }  
</script>  

<style>  
</style>  

操作步骤：

上门代码就是

预期结果：

上门代码就是

实际结果：

上门代码就是