element cascader 不同层级 value值相同 选中后 input内容显示错误

Question

<el-cascader
          v-model="value2"
          :options="options2"
        ></el-cascader>

value2: [],
      options2: [{
        value: 'zhinan',
        label: '指南',
        children: [
          {
            value: 'shejiyuanze',
            label: '设计原则',
            children: [{
              value: '1',
              label: '1'
            }, {
              value: '2',
              label: '2'
            }, {
              value: 'xiaolv',
              label: '效率'
            }, {
              value: 'kekong',
              label: '可控'
            }
            ]
          }, {
            value: 'daohang',
            label: '导航',
            children: [{
              value: '1',
              label: '1'
            }, {
              value: '2',
              label: '2'
            }
            ]
          }
        ]
      }],

现在的问题是 我的不同2级数据 下的3级数据中都有一个 value: 1

我选择时cascader的文字展示出现错误

如图 我选择的是导航下面的1 但显示的是2级是设计原则 (右边v-model绑定的值是正确的)

大佬们这个有啥办法解决呀

Answer 1

解决方法是 遍历每层数据为 value值加唯一标识 如：value -> xxxxxxx_value 提交给后台时再将选中的value唯一标识去除