首页 > web前端 > js教程 > 漂亮班

漂亮班

Linda Hamilton
发布: 2025-01-04 15:26:44
原创
882 人浏览过

Pretty Class

漂亮班

pretty-class 是一个轻量级实用程序包,旨在简化在 JavaScript 和 TypeScript 应用程序中生成动态类名的过程。它提供了一种灵活直观的方式来根据不同的输入类型有条件地组合类名。

安装

要安装pretty-class,请使用npm或yarn:

npm install pretty-class
登录后复制


yarn add pretty-class
登录后复制

用法

导入包

import prettyClass from 'pretty-class';
登录后复制

函数签名

export type prettyClassTypes = string | Record<string, boolean> | prettyClassTypes[] | undefined | null | false;
const prettyClass: (...args: prettyClassTypes[]) => string;
登录后复制

参数

  • args:类型为 PrettyClassTypes 的可变数量的参数。每个参数可以是:
    • 字符串:将字符串直接添加到类列表中。
    • 键为类名、值为布尔值的对象:如果值为 true,则包含键。
    • 数组:递归处理数组元素。
    • undefined、null 或 false:在输出中被忽略。

退货

  • 包含串联类名称的字符串。

用法示例

基本字符串输入

const result = prettyClass('class1', 'class2');
console.log(result); // Output: "class1 class2"
登录后复制

条件类

const result = prettyClass({ 'class1': true, 'class2': false, 'class3': true });
console.log(result); // Output: "class1 class3"
登录后复制

嵌套数组

const result = prettyClass(['class1', { 'class2': true }, ['class3', { 'class4': false }]]);
console.log(result); // Output: "class1 class2 class3"
登录后复制

混合输入

const result = prettyClass('class1', { 'class2': true }, ['class3', null, false]);
console.log(result); // Output: "class1 class2 class3"
登录后复制

好处

  • 轻量级:最少的代码占用。
  • 灵活:支持多种输入类型。
  • 递归:优雅地处理嵌套数组。
  • Typed:为 TypeScript 用户完全键入。

执照

pretty-class 是根据 MIT 许可证获得许可的。有关更多详细信息,请参阅许可证文件。


有关贡献、问题或功能请求,请访问 GitHub 存储库。

以上是漂亮班的详细内容。更多信息请关注PHP中文网其他相关文章!

本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
作者最新文章
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板