关于vue使用el-cascader获取值的问题【超详细】

在Vue中使用el-cascader组件时，你可以通过v-model来双向绑定选中的值。此外，你还可以通过props属性来配置需要的数据结构和事件。

以下是一个简单的例子，展示如何使用el-cascader获取值：

<template>
  <el-cascader
    v-model="selectedValue"
    :options="options"
    @change="handleChange"
    placeholder="请选择"
  ></el-cascader>
</template>
 
<script>
export default {
  data() {
    return {
      selectedValue: [], // 用于双向绑定选中的值
      options: [        // 级联选择器的数据源
        {
          value: 'guide',
          label: '指南',
          children: [
            {
              value: 'disciplines',
              label: '学院',
              children: [
                {
                  value: 'consistency',
                  label: '一致性'
                }
              ]
            },
            // ... 更多选项
          ]
        }
        // ... 更多选项
      ]
    };
  },
  methods: {
    handleChange(value) {
      console.log(value); // 当选中值发生变化时，会触发此方法
    }
  }
};
</script>

在这个例子中，selectedValue是绑定到el-cascader的v-model上的，它将会保存选中项的值。options属性用于定义级联选择器的选项结构。当选中的值发生变化时，handleChange方法会被触发，你可以在这个方法中执行任何需要的操作。