# @equinor/fusion-wc-ripple 中文文档

规范地址：https://npmcn.com/package/%40equinor/fusion-wc-ripple/

版本：1\.2\.4
npm 元数据更新时间：2026-08-12T07:22:40.222Z
中文译文更新时间：2026-11-13T20:57:25.459Z
软件包许可：ISC

本文由上游 README 翻译，可能存在偏差，请结合原文核对 API、命令与配置。版权与许可归原作者所有。

原始 npm 页面：https://www.npmjs.com/package/%40equinor/fusion-wc-ripple
原文对照：https://npmcn.com/package/%40equinor/fusion-wc-ripple/?lang=original
项目主页：https://github.com/equinor/fusion-web-components#readme
源码仓库：https://github.com/equinor/fusion-web-components

## 关键信息（来自 npm 元数据）

- 包体积（解压后）：72.4 kB，11 个文件
- 模块格式：CommonJS
- TypeScript 类型：包内自带
- 运行依赖：3 个
- 首次发布：2021-09-17T08:19:38.735Z
- 最新版本发布：2026-08-12T07:22:39.814Z
- 近 30 天下载量：4482（2026-10-14 至 2026-11-12，npm 官方下载统计）
- 已发布版本数：31（近 12 个月 5 个）

## 中文简介

□\`聚变-wc-ripple'\[!\]\[在npm上写作\](https://img.shields.io/npm/v/@equinor/聚变-wc-ripple.svg)\](https://www.npmjs.com/package/@equinor/聚变-wc-ripple)

## 安装

```sh
npm install @equinor/fusion-wc-ripple
```

也可以使用：`pnpm add @equinor/fusion-wc-ripple`、`yarn add @equinor/fusion-wc-ripple`、`bun add @equinor/fusion-wc-ripple`

## README

## `fusion-wc-ripple` [![Published on npm](https://img.shields.io/npm/v/@equinor/fusion-wc-ripple.svg)](https://www.npmjs.com/package/@equinor/fusion-wc-ripple)

[故事书](https://equinor.github.io/fusion-web-components/?path=/docs/data-ripple)

## 安装

```sh
npm install @equinor/fusion-wc-ripple
```

## 连线 `<fwc-ripple>`

### 属性/属性

| 名称 | 类型 | 默认 | 说明 |
| --- | --- | --- | --- |
| `primary` | `boolean` | `false` | 当真实时, 设置波纹颜色为 `--mdc-theme-primary`将被 `--mdc-ripple-color` 如果设置. |
| `accent` | `boolean` | `false` | 当真实时, 设置波纹颜色为 `--mdc-theme-secondary`将被 `--mdc-ripple-color` 如果设置. |
| `unbounded` | `boolean` | `false` | 当真实时,波纹会在一个圆圈中流出组件外. |
| `activated` | `boolean` | `false` | 当波纹容器在 [`activated`](https://material.io/design/interaction/states.html#activated) 状态. |
| `selected` | `boolean` | `false` | 当波纹的容器在 [`selected`](https://material.io/design/interaction/states.html#selected) 状态. |
| `disabled` | `boolean` | `false` | 设定为已禁用波纹容器时禁用波纹 . |

### 方法

| 名称 | 说明 |
| --- | --- |
| `startPress(event?: Event) => void` | 开始 `press` rip州. 可选 `Event` 当 `unbounded` 是虚假的. |
| `endPress() => void` | 结束 `press` rip州. |
| `startFocus() => void` | 开始 `focus` rip州. |
| `endFocus() => void` | 结束 `focus` rip州. |
| `startHover() => void` | 开始 `hover` rip州. |
| `endHover() => void` | 结束 `hover` rip州. |
|  |  |

## 常见问题

### @equinor/fusion-wc-ripple 是什么？

□\`聚变-wc-ripple'\[\!\]\[在npm上写作\]\(https://img\.shields\.io/npm/v/@equinor/聚变-wc-ripple\.svg\)\]\(https://www\.npmjs\.com/package/@equinor/聚变-wc-ripple\)

### 如何安装 @equinor/fusion-wc-ripple？

在项目目录运行 npm install @equinor/fusion-wc-ripple，或使用 pnpm add / yarn add / bun add。

### @equinor/fusion-wc-ripple 支持 TypeScript 吗？

支持。包内自带 TypeScript 类型声明（package\.json 声明了 types 入口），安装后即可获得类型提示，无需再安装 @types 包。

### @equinor/fusion-wc-ripple 支持 ESM 还是 CommonJS？

以 CommonJS 形式发布，可以直接 require\(\)；在 ES Module 项目中也可以用 import 引入（Node\.js 会把 module\.exports 作为默认导出）。

### @equinor/fusion-wc-ripple 可以商用吗？

@equinor/fusion-wc-ripple 使用 ISC 许可。宽松许可：允许商业使用、修改和再分发，通常只需在分发时保留原版权与许可声明。以上为概括，不构成法律意见，请以许可原文为准。

### @equinor/fusion-wc-ripple 的下载量有多少？

根据 npm 官方下载统计，@equinor/fusion-wc-ripple 在 2026/10/14 – 2026/11/12 这 30 天内被下载 4,482 次，日均约 149 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入，适合横向比较热度，不能直接等同于使用人数。

### @equinor/fusion-wc-ripple 还在维护吗？

最新版本 1\.2\.4 发布于 2026/08/12（3 个月前）；至今共发布 31 个版本，其中过去 12 个月发布了 5 个；首次发布于 2021/09/17。发布频率只是参考信号：功能稳定的工具可能很少需要更新，建议结合源码仓库的 issue 和提交记录判断。