使用vue建省级联动菜单 很简单

3 篇文章 0 订阅
  <el-cascader
              :options="options"
              v-model="selectedOptions"
              @change="handleChange">
      </el-cascader>
      这是用el写的标签  因为放n个不确定的省级数据  所以建议用数组存放数据 
      标签写完了 可以写script 
      如下:
      options:[
                {
                    label:'湖北',
                    value:'湖北',
                    children:[
                        {label:'十堰',value:'十堰'},
                        {label:'武汉',value:'武汉'},
                        {label:'黄冈',value:'黄冈'}
                    ]
                },{
                label:'广东',
                    value:'广东',
                    children:[
                        {label:'南海',value:'南海'},{label:'广东',value:'广东'},{label:'深圳',value:'深圳'}
                    ]
                },
                {
                    label:'湖南',
                    value:'湖南',
                   children:[
                       {label:'长沙',value:'长沙'},
                       {label:'湘潭',value:'湘潭'},
                       {label:'岳阳',value:'岳阳'}
                   ]
                },{
                    label:'四川',
                    value:'四川',
                    children:[
                        {label:'成都',value:'成都'},
                        {label:'绵阳',value:'绵阳'},
                        {label:'德阳',value:'德阳'}
                        ]
                },{
                    label:'河南',
                    value:'河南',
                    children:[
                        {label:'郑州',value:'郑州'},
                        {label:'洛阳',value:'洛阳'},
                        {label:'开封',value:'开封'}]
                },{
                    label:'江西',
                    value:'江西',
                    children:[
                        {label:'南昌',value:'南昌'},
                        {label:'九江',value:'九江'},
                        {label:'吉安',value:'吉安'}]
                },{
                label:'特别行政区',
                    value:'特别行政区',
                    children:[
                        {label:'香港',value:'香港'},
                        {label:'澳门',value:'澳门'}
                    ]
                }
                ],
                如果你看懂了 ,就会发现特别简单  主要是格式  lable 和value 而children 指的就是 在省级下的城市 但是 这样运行的话  控制台就会报错 说selectedOptions  unfidend  所以  你应该在option前加一个 selectoptions =[]  这样就可以了  你们可以试试哦 要是还有问题的话 记得留言 有缘解释
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值