组件
聚光灯 Spotlight
Spotlight:带动态光照的卡片。卡片边缘和表面会随指针位置受光。包装器只测量并写入几何数据,光照由样式表绘制的两层完成。
#基础用法
The pointer is the lamp
Move the hand across the card — the rim catches primary ink where it passes, the face takes a quiet wash, and both die when the hand leaves.
<script setup lang="ts">
import { Spotlight } from "@bysages/vue";
</script>
<template>
<Spotlight class="w-80 rounded-lg p-6">
<h3 class="m-0 text-base font-medium">The pointer is the lamp</h3>
<p class="mb-0 mt-2 text-sm text-tertiary">
Move the hand across the card — the rim catches primary ink where it passes, the face takes a
quiet wash, and both die when the hand leaves.
</p>
</Spotlight>
</template>
#属性
#SSpotlight
Spotlight:带动态光照的卡片。卡片边缘和表面会随指针位置受光。包装器只测量并写入几何数据,光照由样式表绘制的两层完成。
| 属性 | 类型 | 默认值 | 描述 |
|---|---|---|---|
radius | String | undefined | — |