使用Bootsrap vue在Vuejs中添加或删除工具提示

时间:2018-07-02 09:40:14

标签: vuejs2 tooltip bootstrap-vue

我用Bootstrap Vue的v-b-tooltip编写了一个行代码。但是我只想在某些情况下提供工具提示。如何设置条件是否具有工具提示。

<b-btn v-b-tooltip="'Tooltip'">

2 个答案:

答案 0 :(得分:1)

禁用工具提示的一种可能方法是使用“ b-tooltip”元素。像这样:

<b-btn id="my-button">OK</b-btn>
<b-tooltip :disabled.sync="disableTooltip" target="my-button">Tooltip</b-tooltip>

<b-btn @click="disableTooltip = !disableTooltip">Enable / Disable Tooltip</b-btn>

确保数据对象中具有“ disableTooltip”属性。

更多信息:

https://bootstrap-vue.js.org/docs/components/tooltip/#programmatically-disabling-tooltip

答案 1 :(得分:0)

  

通过$ root事件禁用和启用工具提示   您可以通过在$ root:上发出bv :: disable :: tooltip事件来禁用所有打开的工具提示。

this.$root.$emit('bv::disable::tooltip');

  

要禁用特定的工具提示,请将trigger元素的id作为第一个参数传递:

this.$root.$emit('bv::disable::tooltip', 'my-trigger-button-id');

Here the Doc with more examples