情境：按鈕禁用的時(shí)候顯示tips提示
如果我們按照一般的做法是在el-tooltip標(biāo)簽中包裹設(shè)置禁用disabled屬性的el-button按鈕，理論上這樣就能達(dá)到想要的效果，“紙上得來終覺淺，絕知此事要躬行”，讓我們手動試一下，效果如下：
代碼如下：
<div class="appBody">
<el-tooltip class="item" effect="dark" content="沒有點(diǎn)擊的權(quán)限" placement="top">
<el-button type="primary" disabled>同意</el-button>
</el-tooltip>
<el-button type="primary">駁回</el-button>
</div>?答案是不能做到！
我們在禁用按鈕的時(shí)候，其實(shí)把tips也禁用掉了，tooltip就是包裹button的，那個(gè)tips就是加在按鈕上，按鈕都被禁用了，tips怎么可能還會出現(xiàn)呢？
想要達(dá)到禁用的按鈕鼠標(biāo)經(jīng)過時(shí)出現(xiàn)tips提示，解決辦法是：在button外面再套一層標(biāo)簽，tooltip包裹里的第一級是誰，那么tips就是加給誰的，所以我們把tips加給button的外層，那個(gè)按鈕的禁用disabled只會影響按鈕而不會影響其他元素。
話不多說，效果圖如下：
代碼如下（在按鈕外面加一個(gè)span標(biāo)簽）：文章來源：http://www.zghlxwxcb.cn/news/detail-528722.html
<div class="appBody">
<el-tooltip class="item" effect="dark" content="沒有點(diǎn)擊的權(quán)限" placement="top">
<!-- span是button的外層標(biāo)簽 -->
<span>
<el-button type="primary" disabled>同意</el-button>
</span>
</el-tooltip>
<el-button type="primary">駁回</el-button>
</div>?文章來源地址http://www.zghlxwxcb.cn/news/detail-528722.html
到了這里，關(guān)于element-ui給禁用的按鈕設(shè)置鼠標(biāo)經(jīng)過顯示tooltip的tips提示的文章就介紹完了。如果您還想了解更多內(nèi)容，請?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
![[element-ui] el-table表格頭添加圖標(biāo)-鼠標(biāo)移入顯示el-tooltip提示信息](https://imgs.yssmx.com/Uploads/2024/02/512233-1.png)
