naive-ui/demo/documentation/components/dropdown/enUS/placement.md

38 lines
838 B
Markdown
Raw Normal View History

2019-10-22 13:48:51 +08:00
# Placement
Use different placement.
2019-10-22 13:48:51 +08:00
```html
<n-dropdown @select="handleSelect" placement="bottom-start" :options="options">
<n-button :keyboard="false">Money Force Us to Work Rather Than Sleep</n-button>
2019-10-22 13:48:51 +08:00
</n-dropdown>
```
```js
export default {
data () {
return {
options: [
{
label: 'Marina Bay Sands',
value: 'Marina Bay Sands'
},
{
label: 'Brown\'s Hotel, London',
value: 'Brown\'s Hotel, London'
},
{
label: 'Atlantis Bahamas, Nassau',
value: 'Atlantis Bahamas, Nassau'
},
{
label: 'The Beverly Hills Hotel, Los Angeles',
value: 'The Beverly Hills Hotel, Los Angeles'
}
]
2019-10-22 13:48:51 +08:00
}
},
methods: {
handleSelect (name) {
this.$NMessage.info(name)
2019-10-22 13:48:51 +08:00
}
}
}
```