Vue EasyUI 提示框

2020-06-24 11:37 更新

當(dāng)用戶的鼠標(biāo)指針停留在某個(gè)元素上時(shí),該元素出現(xiàn)提示信息窗口用來顯示額外的元素相關(guān)信息。

屬性列表

名稱 數(shù)據(jù)類型 作用描述 默認(rèn)值
tooltipCls string 提示框樣式類。 null
tooltipStyle Object 提示框的內(nèi)聯(lián)樣式。 null
content string或TooltipContentComponent 提示框內(nèi)容。 null
component string, Object, Function 顯示提示框內(nèi)容組件。 null
propsData Object 支持傳遞給組件。 null
position string 提示框的位置。可選值:'left', 'right', 'top', 'bottom'。 bottom
trackMouse boolean 為True時(shí),使提示框同鼠標(biāo)一起移動(dòng)。 false
deltaX number 與提示框位置的水平距離。 0
deltaY number 與提示框位置的垂直距離。 0
showDelay number 顯示提示框的時(shí)間延遲。 200
hideDelay number 隱藏提示框的時(shí)間延遲。 100
showEvent string 使提示框出現(xiàn)的事件。 mouseenter
hideEvent string 使提示框隱藏的事件。 mouseleave

事件列表

名稱 參數(shù) 作用描述
tooltipShow none 顯示提示框時(shí)觸發(fā)。
tooltipHide none 隱藏提示框時(shí)觸發(fā)。

注:
- 繼承: None 。

使用方法

從 HTML 標(biāo)記創(chuàng)建元素,使用 Vue.js 的 V-指令創(chuàng)建提示框( Tooltip )。

    <div style="background:red ;width:50px ;height:20px" v-Tooltip="'This is a tooltip.'">Hover Me</div>
以上內(nèi)容是否對(duì)您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號(hào)
微信公眾號(hào)

編程獅公眾號(hào)