我正在尋找最佳實踐 vuetify 渲染方式：
文本欄位右側的按鈕（附加）
<v-row class="text-center d-flex justify-center" v-if="downloadOption == 'HTML'">
<v-text-field dense outlined v-model="imageLink" label="Image Link" required></v-text-field>
<v-btn large class="ma-1" outlined color="indigo"> Copy </v-btn>
<v-text-field dense outlined v-model="html" label="HTML" required></v-text-field>
<v-btn large class="ma-1" outlined color="indigo"> Copy </v-btn>
</v-row>
你們對如何做到這一點有任何提示嗎？
uj5u.com熱心網友回復：
試試這個：
new Vue({
el: '#app',
vuetify: new Vuetify(),
}).v-btn {
height: 39px !important;
}<script src="https://unpkg.com/[email protected]/dist/vue.js"></script>
<script src="https://unpkg.com/[email protected]/dist/vuetify.min.js"></script>
<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/vuetify.min.css"/>
<div id="app">
<v-app id="inspire">
<v-form>
<v-container>
<v-row>
<v-col cols="8" sm="6" class="pr-1">
<v-text-field dense outlined v-model="html" label="HTML" required></v-text-field>
</v-col>
<v-col cols="4" sm="6" class="pl-0">
<v-btn large outlined color="indigo"> Copy </v-btn>
</v-col>
</v-row>
</v-container>
</v-form>
</v-app>
</div>uj5u.com熱心網友回復：
嘗試使用組件append中的插槽v-text-field：
<v-text-field dense outlined v-model="html" label="HTML" required >
<template #append>
<v-btn outlined color="indigo"> Copy </v-btn>
</template>
</v-text-field>
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/457849.html