el-tooltip内嵌套el-progressel-progress始终显示el-tooltip根据数据条件判断是否显示
你可以使用v-if指令来根据数据条件判断是否显示el-tooltip组件。以下是一个示例:
<template>
<div>
<el-tooltip v-if="showTooltip" effect="dark" content="这是一个进度条" placement="top">
<el-progress :percentage="progress" :text-inside="true" />
</el-tooltip>
<el-button @click="toggleTooltip">切换显示</el-button>
</div>
</template>
<script>
export default {
data() {
return {
showTooltip: false,
progress: 50,
};
},
methods: {
toggleTooltip() {
this.showTooltip = !this.showTooltip;
},
},
};
</script>
在上面的示例中,el-tooltip组件的显示状态由showTooltip数据属性控制。当showTooltip为true时,el-tooltip显示;当showTooltip为false时,el-tooltip隐藏。
你可以根据你的业务逻辑来决定何时设置showTooltip为true或false,以达到根据数据条件判断是否显示el-tooltip组件的效果
原文地址: http://www.cveoy.top/t/topic/izt6 著作权归作者所有。请勿转载和采集!