<template>
  <div class="demo-dropdown-basic">
    <ui-dropdown
      popper-class="demo-dropdown-popper"
      @click="handleClick">
      <a @click.prevent>
        小满团队
        <ui-icon
          size="12px"
          name="chevrondown"
          style="vertical-align:baseline;"></ui-icon>
      </a>
      <template slot="dropdown">
        <ui-dropdown-item name="fe">
          小满前端
        </ui-dropdown-item>
        <ui-dropdown-item name="test">
          小满后端
        </ui-dropdown-item>
        <ui-dropdown-divider></ui-dropdown-divider>
        <ui-dropdown-item disabled>
          小满测试
        </ui-dropdown-item>
      </template>
    </ui-dropdown>
  </div>
</template>

<script>
import { Dropdown, DropdownItem, DropdownDivider, Icon } from "amumu-ui"
export default {
  components: {
    "ui-dropdown": Dropdown,
    "ui-dropdown-item": DropdownItem,
    "ui-dropdown-divider": DropdownDivider,
    "ui-icon": Icon,
  },
  methods: {
    handleClick(event, mame) {
      console.log("value", mame)
    },
  },
}
</script>
<style lang="scss">
.demo-dropdown-popper {
  width: 160px;
}
</style>
