a-tree-select组件@change事件中获取到原数组中的其他属性

 场景：页面上展示一个a-tree-select组件，但是我需要再change变动时获取到gateway

我的源数据：

//locationList数据格式
locationList:[

{
value:'xxxxxxxxxxxx',
key:'xxxxxxxxxxxxxxx',
title:'xxxxxxxxxxxxxx',
gateway:'xxxxxxxxxx',
children:[]
},

{
value:'xxxxxxxxxxxx',
key:'xxxxxxxxxxxxxxx',
title:'xxxxxxxxxxxxxx',
gateway:'xxxxxxxxxx'
}

]

方法有两种：

1、使用:replace-fields替换为想要的gateway,在change事件触发时，通过value就拿到了gateway,

但是这种方式有一个局限性：gatwway必须为唯一的值，不能与其他项的gateway重复。

:replace-fields="{
value: 'gateway',
label: 'title'
}"

    // 空间改变
    treeSelectChange(value, label, extra) {
      console.log('value',value)
    },

 

 2、使用 change的参数extra获取，具体方法：extra.triggerNode.$vnode.data.props.gateway

（由于，我的数据中gateway可能为空也可能重复，所以使用方法一会报错，所以我使用的是方法2.）

   <a-tree-select
      v-model="locationId"
      @change="treeSelectChange"
      style="width: 100%"
      :tree-data="locationList"
      placeholder="空间选择"
      search-placeholder="空间选择"
      show-search
      tree-node-filter-prop="title"
    />

    // 空间改变
    treeSelectChange(value, label, extra) {
      console.log(
        ' extra.triggerNode.$vnode.data.props.value',
        extra.triggerNode.$vnode.data.props,
        extra.triggerNode.$vnode.data.props.gateway
      )
// extra.triggerNode.$vnode.data.props获取到选中项的所有属性
// extra.triggerNode.$vnode.data.props.gateway拿到想要的gateway属性

      this.queryParam.gatewayId = extra.triggerNode.$vnode.data.props.gateway//将gateway保存起来
    },