Element-ui中的Cascader级联选择器基础用法

import Vue from 'vue'
import { Cascader } from 'element-ui'
import 'element-ui/lib/theme-chalk/base.css'
import 'element-ui/lib/theme-chalk/cascader.css'
Vue.use(Cascader)

<template>
    <el-cascader v-model="value" :options="options"></el-cascader>
</template>
<script>
export default {
    data() {
        return {
            value: [],
            options: [
                {
                    value: 'zhinan',
                    label: '辅助',
                    children: [
                        {
                            value: 'caiwenji',
                            label: '蔡文姬'
                        },
                        {
                            value: 'xiaoming',
                            label: '小明'
                        }
                    ]
                },
                {
                    value: 'zujian',
                    label: '中单',
                    children: [
                        {
                            value: 'zhenji',
                            label: '甄姬'
                        },
                        {
                            value: 'xiaoqiao',
                            label: '小乔'
                        }
                    ]
                },
                {
                    value: 'sheshou',
                    label: '射手',
                    children: [
                        {
                            value: 'make',
                            label: '马可波罗'
                        },
                        {
                            value: 'sunshangxiang',
                            label: '孙尚香'
                        }
                    ]
                }
            ]
        }
    }
}
</script>