27 lines
889 B
Vue
27 lines
889 B
Vue
<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>
|