可构造的纯 JavaScript DOMTokenList 实现，支持非浏览器运行时。

安装

安装模块

npm install @wordpress/token-list

此软件包假定你的代码将在 ES2015+ 环境中运行。如果你使用的环境对此类语言特性和 API 的支持有限或完全不支持，则应在代码中包含 由 @wordpress/babel-preset-default 提供的 polyfill。

用法

构造一个新的令牌列表，可选地指定初始值。返回一个接口与 DOMTokenList 匹配的值。

import TokenList from '@wordpress/token-list';

const tokens = new TokenList( 'abc def' );
tokens.add( 'ghi' );
tokens.remove( 'def' );
tokens.replace( 'abc', 'xyz' );
console.log( tokens.value );
// "xyz ghi"

DOMTokenList 的所有方法均已实现。

请注意以下实现与 规范 的差异：

  • TokenList#supports 将始终返回 true，无论传入什么令牌。
  • TokenList#add 和 TokenList#remove 只会忽略空字符串参数或令牌参数中的空白字符，而不会 抛出错误。
  • 不能通过索引以属性形式引用某个条目。请改用 TokenList#item。

浏览器支持

虽然它可以用在你自己的实现中，但它并非旨在作为 Element#classList 或其他 DOMTokenList 实例的 polyfill。

通过 @wordpress/token-list 提供的 DOMTokenList 接口实现在支持 ES5 的环境（IE8 及更新版本）中广泛兼容。话虽如此，由于其内部实现借助数组来实现 TokenList#entries、TokenList#forEach、TokenList#keys 和 TokenList#values，如果你打算使用这些函数，可能需要确保它们受支持或已提供 polyfill。

  • https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/entries#Browser_compatibility
  • https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/values#Browser_compatibility

TokenList 自身对 DOMTokenList 接口的内部实现没有使用这些函数，因此在基本用法中无需为它们提供 polyfill。

参与贡献此软件包

这是一个独立软件包，是 Gutenberg 项目的一部分。该项目组织为一个 monorepo。它由多个自包含的软件包组成，每个软件包都有特定用途。此 monorepo 中的软件包发布到 npm，并由 WordPress 以及其他软件项目使用。

要了解更多关于参与此软件包或整个 Gutenberg 项目贡献的信息，请阅读项目的主要 贡献者指南。