element如果Button被Disable了,如何顯示Tooltip


需求

按鈕被disabled了需要顯示tooltip

錯誤案例

直接用tooltip包着按鈕

<el-tooltip placement="top" :disabled="tooltipDisabled" content="按鈕被disabled了需要顯示tooltip">
    <el-button style="margin-bottom:10px" :disabled="btnDisabled" type="primary" size="small" @click="handleEdit">上傳腳本</el-button>
</el-tooltip>

解決

在tooltip中可以用disabled來控制tooltip是否可用
用div包着button;並且寬度設置與button大小一致(我這里使用的寬度是80px)

代碼如下:

<el-tooltip placement="top" :disabled="tooltipDis" content="腳本版本數不能超過5個,請刪除棄用的腳本后再上傳。">
  <div style="width:80px">
    <el-button style="margin-bottom:10px" :disabled="upLoadDisabled" type="primary" size="small" @click="handleEdit">上傳腳本</el-button>
  </div>
</el-tooltip>

element如果Button被Disable了,如何顯示Tooltip


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM