mirror of
https://github.com/tusen-ai/naive-ui.git
synced 2025-01-12 12:25:16 +08:00
31 lines
646 B
Markdown
31 lines
646 B
Markdown
# Placement
|
||
```html
|
||
<n-dropdown @select="handleSelect" placement="bottom-start" :focusable="false">
|
||
<template v-slot:activator>
|
||
<n-button>I want to go sleep!</n-button>
|
||
</template>
|
||
<n-dropdown-item
|
||
v-for="hotel in hotels"
|
||
:key="hotel"
|
||
:name="hotel.toLowerCase()"
|
||
>
|
||
{{ hotel }}
|
||
</n-dropdown-item>
|
||
</n-dropdown>
|
||
```
|
||
```js
|
||
export default {
|
||
data () {
|
||
return {
|
||
hotels: [
|
||
'Marina Bay Sands, Singapore', 'Brown’s Hotel, London', 'Atlantis Bahamas, Nassau', 'The Beverly Hills Hotel, Los Angeles'
|
||
]
|
||
}
|
||
},
|
||
methods: {
|
||
handleSelect (name) {
|
||
this.$NMessage.info(name)
|
||
}
|
||
}
|
||
}
|
||
``` |