naive-ui/demo/documentation/components/dropdown/enUS/trigger.md
2019-10-22 13:48:51 +08:00

795 B

Trigger

<n-dropdown
  trigger="hover"
  style="margin-right: 16px;"
>
  <template v-slot:activator>
    <div>Trigger: hover</div>
  </template>
  <n-dropdown-item
    v-for="item in items"
    :key="item"
    @click="handleClick(item)"
  >
    {{ item }}
  </n-dropdown-item>
</n-dropdown>
<n-dropdown trigger="click">
  <template v-slot:activator>
    <div>Trigger: click</div>
  </template>
  <n-dropdown-item
    v-for="item in items"
    :key="item"
    @click="handleClick(item)"
  >
    {{ item }}
  </n-dropdown-item>
</n-dropdown>
export default {
  data () {
    return {
      items: ['item1longlonglong', 'item2longlonglong', 'item3longlonglong', 'item4longlonglong']
    }
  },
  methods: {
    handleClick (item) {
      this.$NMessage.info(item)
    }
  }
}