交互状态 插件
使元素支持 hover 、 press 、 focus 、 selected 、 disabled 交互状态样式。
适用平台
支持所有平台。
安装插件
需要安装 state 插件才能使用，点此访问 Github 仓库。
sh
npm install @leafer-in/statesh
pnpm add @leafer-in/statesh
yarn add @leafer-in/statesh
bun add @leafer-in/state浏览器
通过全局变量 LeaferIN.state 访问插件内部功能。
html
<script src="https://unpkg.com/@leafer-in/state@1.0.0-rc.27/dist/state.min.js"></script>html
<script src="https://unpkg.com/@leafer-in/state@1.0.0-rc.27/dist/state.js"></script>https://unpkg.com 无法访问时，可替换为 https://cdn.jsdelivr.net/npm
体验
按钮交互效果
ts
import { Leafer, Rect } from 'leafer-ui'
import '@leafer-in/state'
const leafer = new Leafer({ view: window })
const rect = new Rect({
width: 100,
height: 100,
fill: 'rgba(50,205,121, 0.7)',
cornerRadius: 30,
hoverStyle: { fill: 'rgba(50,205,121, 0.8)' },
pressStyle: { fill: 'rgba(50,205,121, 1)' },
cursor: 'pointer'
})
leafer.add(rect)