Tried to change the icon behind the tree selection when using the Ant Design Vue library, but was unsuccessful

In the official documentation, the tree selector component can change the suffix icon. The official code is

<template>
  <a-space direction="vertical" style="width: 100%">
    <a-tree-select
      v-model:value="value"
      show-search
      style="width: 100%"
      :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
      placeholder="Please select"
      allow-clear
      tree-default-expand-all
      :tree-data="treeData"
    >
      <template #suffixIcon><SmileOutlined /></template>
    </a-tree-select>
  </a-space>
</template>
<script>
import { SmileOutlined } from '@ant-design/icons-vue';
import { defineComponent, ref, watch } from 'vue';
export default defineComponent({
  components: {
    SmileOutlined,
  },
  setup() {
    const value = ref();
    const treeData = ref([{
      title: 'parent 1',
      value: 'parent 1',
      children: [{
        title: 'parent 1-0',
        value: 'parent 1-0',
        children: [{
          title: 'my leaf',
          value: 'leaf1',
        }, {
          title: 'your leaf',
          value: 'leaf2',
        }],
      }, {
        title: 'parent 1-1',
        value: 'parent 1-1',
      }],
    }]);
    watch(value, () => {
      console.log('select', value.value);
    });
    return {
      value,
      treeData,
    };
  },
});
</script>

ICONS in official documents can be changed

In my own tree selection, the official method is invalid, the suffix icon simply disappears

My own code is as follows

<a-col style="padding: 10px 6px 10px 5px">
                  <a-tree-select
                    v-show="userInfo.orgType !== 3"
                    v-model="params.departmentId"
                    :placeholder="$STR('hint.orgUser.searchByDept', '按部门搜索')"
                    :searchPlaceholder="$STR('hint.orgUser.inputDeptName', '请输入部门名称')"
                    :tree-data="depaTreeData"
                    show-search
                    treeNodeFilterProp="title"
                    :replaceFields="{
                      children: 'children',
                      title: 'name',
                      key: 'id',
                      value: 'id'
                    }"
                    :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
                    allow-clear
                    tree-default-expand-all>
                    <template #suffixIcon><SmileOutlined /></template>
                  </a-tree-select>
                </a-col>
//icon标签的引入也有写
import { SmileOutlined } from '@ant-design/icons-vue'
components: { AddDistributor, AddUser, DrawerPermission, Attrs, ModuleLayout, Upload, SmileOutlined },

but it just didn't work, the suffix icon just disappeared