<el-col :span="16" :xs="24" :sm="12" :md="8" :lg="8">
<el-form-item :label="t('优先级备注')">
<el-input clearable :placeholder="t('请输入优先级备注')" resize="none" :maxlength="10" v-model="form.priority_remake">
<template #prepend>
<!-- 外部tooltip -->
<el-tooltip
placement="top"
effect="light"
>
<!-- 插槽 -->
<template #content class="tips-content text-tips-content">
<div>
<!-- 内部tooltip -->
<el-tooltip
placement="top"
content="危险"
>
<app-svg-icon class="w-20 h-20" icon-name="tooltip-red-icon" @click="handleSelectPrioritylevel('危险',3)"></app-svg-icon>
</el-tooltip>
<el-tooltip
placement="top"
content="警告"
>
<app-svg-icon class="w-20 h-20" icon-name="tooltip-orange-icon" @click="handleSelectPrioritylevel('警告',2)"></app-svg-icon>
</el-tooltip>
<el-tooltip
placement="top"
content="一般"
>
<app-svg-icon class="w-20 h-20" icon-name="tooltip-green-icon" @click="handleSelectPrioritylevel('一般',1)"></app-svg-icon>
</el-tooltip>
</div>
</template>
<app-svg-icon class="w-20 h-20" icon-name="square-filled-red"></app-svg-icon>
</el-tooltip>
</template>
</el-input>
</el-form-item>
</el-col>
elementPLUS的Tooltip将内容属性可以设置为 HTML 字符串。设置raw-content不生效的情况下,可以使用插槽的方式解决
于 2022-12-22 17:59:08 首次发布