u

code/g3soft-libs/docs/examples/tooltip/disabled.vue

@@ -0,0 +1,26 @@
+<script setup lang="ts">
+// 受控与禁用：disabled 时不响应 hover；也可以用 open 手动控制
+import { ref } from 'vue'
+import { G3Button, G3Space, G3Switch, G3Tooltip } from '@g3soft/ui'
+
+const enabled = ref(true)
+const open = ref(false)
+</script>
+
+<template>
+  <G3Space direction="vertical" :size="16" style="display: flex">
+    <G3Space :size="8" align="center">
+      <G3Switch v-model="enabled">启用提示</G3Switch>
+      <G3Tooltip :disabled="!enabled" content="现在可以看到了">
+        <G3Button type="outline">悬停试试</G3Button>
+      </G3Tooltip>
+    </G3Space>
+
+    <G3Space :size="8" align="center">
+      <G3Switch v-model="open">受控显示</G3Switch>
+      <G3Tooltip :open="open" content="由 open 控制，不受 hover 影响">
+        <G3Button type="outline">受控提示</G3Button>
+      </G3Tooltip>
+    </G3Space>
+  </G3Space>
+</template>