ant-design-vue/components/select/demo/custom-dropdown-menu.md

813 B

#### 扩展菜单 使用 `dropdownRender` 对下拉菜单进行自由扩展。 #### Custom dropdown Customize the dropdown menu via `dropdownRender`.
<template>
  <a-select defaultValue="lucy" style="width: 120px">
    <div slot="dropdownRender" slot-scope="menu">
      <v-nodes :vnodes="menu"/>
      <a-divider style="margin: 4px 0;" />
      <div style="padding: 8px; cursor: pointer;">
        <a-icon type="plus" /> Add item
      </div>
    </div>
    <a-select-option value="jack">Jack</a-select-option>
    <a-select-option value="lucy">Lucy</a-select-option>
  </a-select>
</template>
<script>
export default {
  data: ()=>({console: console}),
  components: {
    VNodes: {
      functional: true,
      render: (h, ctx) => ctx.props.vnodes
    }
  },
}
</script>