antd vue 走马灯 dots
时间: 2023-10-14 11:21:11 浏览: 194
vue3.2 + antd vue3. 基于vue3.2 + antd vue3的后台管理系统.zip
Ant Design Vue 的走马灯(Carousel)组件默认是没有显示 dots 的,但可以通过设置 `dots` 属性来开启 dots 的显示。示例代码如下:
```html
<template>
<a-carousel :dots="true">
<div v-for="i in 3" :key="i">
<h3>{{ i }}</h3>
</div>
</a-carousel>
</template>
```
在上面的示例代码中,我们将 `dots` 属性设置为 `true`,这样就开启了 dots 的显示。
另外,你还可以通过 `dotPosition` 属性来设置 dots 的位置,可选值为 `'top'`、`'bottom'`、`'left'` 和 `'right'`。示例代码如下:
```html
<template>
<a-carousel dots :dotPosition="'bottom'">
<div v-for="i in 3" :key="i">
<h3>{{ i }}</h3>
</div>
</a-carousel>
</template>
```
在上面的示例代码中,我们将 `dotPosition` 属性设置为 `'bottom'`,这样 dots 就会显示在走马灯底部。
阅读全文