欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

vue el-form-item如何添加icon和tooltip

 更新時(shí)間:2023年10月17日 16:55:02   作者:布熬夜了  
這篇文章主要介紹了vue el-form-item如何添加icon和tooltip問題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教

el-form-item添加icon和tooltip

1.el-form-item添加icon與tooltip

使用slot="label"解決,代碼如下:

<el-form-item prop="examine6Remark">
	<template slot="label">
		審查項(xiàng)目6描述
	</template>
	<el-input type="textarea" :autosize="{ minRows: 3, maxRows: 6}" placeholder="請(qǐng)輸入審查項(xiàng)目6描述" v-model="form.examine6Remark" maxlength="255">
	</el-input>
</el-form-item>

2.tooltip換行實(shí)現(xiàn)

使用slot="content"解決,代碼如下:

<el-tooltip class="item" effect="dark" placement="bottom">
	<div slot="content">
		供應(yīng)商不得在“信用中國(guó)”網(wǎng)站<br/>
		(www.creditchina.gov.cn)<br/>
		被列入“失信被執(zhí)行人名單”。
	</div>
	<i class="el-icon-question"></i>
</el-tooltip>

最終效果

vue設(shè)置el-form-item是否可編輯

設(shè)置el-input,textarea只讀方法,使顯示的文本內(nèi)容不允許變更。

此時(shí),可通過頁(yè)面限制防止用戶修改

方法:添加 readonly="true" 或者 :disabled="true" 均可實(shí)現(xiàn)。

代碼示例如下所示:

<el-form-item label="用戶:" :label-width="formLabelWidth">
    <el-input type="textarea" readonly="true" v-model="formData.benchmarkDetail" clearable placeholder="請(qǐng)輸入"></el-input>
</el-form-item>
<el-form-item label="昵稱:" :label-width="formLabelWidth">
    <el-input type="textarea" :disabled="true" v-model="formData.targetDetail" clearable placeholder="請(qǐng)輸入"></el-input>
</el-form-item>

從顯示樣式上簡(jiǎn)單來看:

1、使用屬性  readonly="true" 方式,輸入框或文本域無灰色底

2、使用屬性  :disabled="true" 方式,輸入框或文本域有灰色底

總結(jié)

以上為個(gè)人經(jīng)驗(yàn),希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。

相關(guān)文章

最新評(píng)論