a-input-number 如何加addonAfter属性
时间: 2023-11-08 18:22:34 浏览: 212
material-input-chips:材料输入芯片
a-input-number 是 Ant Design Vue 中的一个数字输入框组件,可以通过 `addonAfter` 属性在输入框后面添加一个固定文本或操作按钮。
例如,如果要在 a-input-number 后面添加一个单位为“元”的文本,可以这样写:
```html
<a-input-number :addon-after="'元'"></a-input-number>
```
如果要在 a-input-number 后面添加一个操作按钮,可以使用 a-button 作为 addonAfter 的值,然后在 a-button 上设置相应的属性和事件。
```html
<a-input-number :addon-after="button"></a-input-number>
<a-button type="primary" icon="search" @click="handleClick"></a-button>
```
```javascript
data() {
return {
button: <a-button type="primary" icon="search" onClick={this.handleClick}></a-button>
}
},
methods: {
handleClick() {
// 处理点击事件
}
}
```
需要注意的是,addonAfter 属性接受一个 VNode 类型的值,所以需要使用 JSX 或者手动创建 VNode。
阅读全文