更新记录

1.0.2（2024-07-06）

1、修复了部分bug 2、完善了组件展示 3、新增了选项标签、选项值、自选项的自定义配置

1.0.1（2024-05-27）

1、箭头展示bug 2、添加弹窗阴影 3、添加操作按钮颜色

1.0.0（2024-05-24）

多选级联菜单

平台兼容性

uni-app

uni-app x

wx-cascader

1.购买插件，选择该插件绑定的项目。

2.根据插件作者的提供的文档开发代码，在代码中引用插件，调用插件功能。

3.本插件

API

props 选项属性说明

代码示例

<template>
    <view class='wx-cascader-main'>
        <view class="wx-cascader-cell">
            <text>区域选择：</text>
            <view>
                <wx-cascader 
                    :options="options" 
                    v-model="list" 
                    :props="{
                        disabled: false,
                        multiple: false,
                        checkStrictly: false,
                        label: 'label',
                        value: 'value',
                        children: 'children'
                    }" 
                    placeholder="请选择" 
                    @change="onChange"></wx-cascader>
            </view>
        </view>
    </view>
</template>

<script>
    import WxCascader from './components/wx-cascader/wx-cascader.vue'
    export default {
        components: {
            WxCascader
        },
    data() {
        return {
                options: [
                    {
                        label: '中国',
                        value: '1',
                        children: [
                            {
                                label: '湖南',
                                value: '2',
                                children: [
                                    {
                                        label: '长沙',
                                        value: '4',
                                    },
                                    {
                                        label: '张家界',
                                        value: '5',
                                    }
                                ]
                            },
                            {
                                label: '广东',
                                value: '3',
                                children: [
                                    {
                                        label: '东莞',
                                        value: '6',
                                    },
                                    {
                                        label: '佛山',
                                        value: '7',
                                    }
                                ]
                            }
                        ]
                    }
                ],
                list: [4,5]
        }
    },
    onLoad () {

    },
    methods: {
            onChange (e) {
                console.log(e)
            }
    }
    }
</script>

<style lang='scss' scoped>
  .wx-cascader-main {
        width: 100%;
        height: 100%;
        .wx-cascader-cell {
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 0 20rpx;
            margin-top: 20rpx;
            > view {
                width: 500rpx;
                border: 1rpx solid #ccc;
                border-radius: 10rpx;
                padding: 0 20rpx;
                box-sizing: border-box;
            }
        }
    }
</style>