ant design vue中想更改a-tree-select的数据键值对名字

首先可以看看https://www.antdv.com/components/tree-select-cn/中的 replaceFields 这个参数 你可能就有灵感了 就不用看我废话了

// 引入树形结构 replace-fields这个后面就是你要改的格式 value和title是官网给的数据结构的键值对 而name和tit则是要替换的键值对 这样就不会报错了 否则会一直报循环不到键值对
<a-tree-select
      v-model="value"
      style="width: 100%"
      :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
      :tree-data="treeData"
      :replace-fields="{children:'children', key:'key', value: 'name', title: 'tit'}"
      placeholder="Please select"
      tree-default-expand-all
    >
    </a-tree-select>

看看页面中的数据：

const treeData = [
  {
    tit: 'Node1',//按照官方文档这里的键值对应该是title 下面就不写注释了
    name: '0-0', //按照光放文档这里的键值对应该是value 下面就不写注释了
    key: '0-0',
    children: [
      {
        tit: 'Child Node1', //title
        name: '0-0-1', // value
        key: '0-0-1',
      },
      {
        tit: 'Child Node2',
        name: '0-0-2',
        key: '0-0-2',
      },
    ],
  },
  {
    tit: 'Node2',
    name: '0-1',
    key: '0-1',
    children: [
      {
        tit: 'Child Node2-1',
        name: '0-2-1',
        key: '0-2-1',
      },
      {
        tit: 'Child Node2-2',
        name: '0-2-2',
        key: '0-2-2',
      },
    ],
  },
];

之后就可以正常显示了