gpt4 book ai didi

vue.js - 将多个图标 append 到 Vuetify.js 中的输入

转载 作者:搜寻专家 更新时间:2023-10-30 22:30:41 25 4
gpt4 key购买 nike

我知道如何使用 append-icon 属性在输入的末尾 append 一个图标,如下所示:

new Vue({
el: '#app'
})
<link href="https://use.fontawesome.com/releases/v5.5.0/css/all.css" rel="stylesheet" />
<link href="https://cdn.jsdelivr.net/npm/vuetify@1.3.8/dist/vuetify.min.css" rel="stylesheet" />
<script src="https://cdn.jsdelivr.net/npm/vue@2.5.17/dist/vue.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/vuetify@1.3.8/dist/vuetify.min.js"></script>

<div id="app">
<v-text-field
label="Answer (optional)"
append-icon="fas fa-times"
@click:append="$emit('remove-answer')"
></v-text-field>
</div>

但是有没有办法像在 Bootstrap 中那样 append 多个图标或按钮?

我想添加一些具有不同操作的图标,但到目前为止我还没有找到解决方案...

最佳答案

你可以使用插槽 appendappend-outer,你可以在其中添加任何你想要的内容。

v-text-field label="Answer (optional)">
<template slot="append">
<v-icon>clear</v-icon>
<v-icon>search</v-icon>
</template>
</v-text-field>

Codepen

关于vue.js - 将多个图标 append 到 Vuetify.js 中的输入,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53289726/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com