npm 包 j-echo 使用教程

阅读时长 4 分钟读完

介绍

j-echo 是一个轻量级的前端库,它提供了一个能够简单地输出信息的函数,可用于开发过程中的调试和信息输出。它能够在控制台输出信息,并且支持将信息输出到 html 页面上,十分方便。

安装

使用 npm 安装 j-echo:

使用

安装完毕后,在需要使用的地方引入库:

API

j-echo 提供了两个 API:

echo(msg: string | object, toEl?: HTMLElement, attrs?: Object)

输出信息并打印在控制台上。如果 toEl 参数指定为 html 元素,信息将会被输出到该元素上。

  • msg: string | object - 需要输出的信息,可以是字符串或者对象。
  • toEl?: HTMLElement - 指定输出信息的 html 元素,如果没有,则信息只会被打印在控制台上。
  • attrs?: Object - 传入的 html 元素属性,比如 class、id 等。

例如:

set(options: Object)

设置 j-echo 输出的默认配置。

  • options: Object - 配置对象。

默认配置如下:

属性:

  • outputToConsole: boolean - 是否输出到控制台,默认为 true。
  • toEl: HTMLElement | null - 指定输出信息的 html 元素,默认为 null。
  • attrs: Object - 传入的 html 元素属性,默认为 {}。
  • stringifyObject: boolean - 是否将输出的对象转换为 JSON 字符串,默认为 true。

例如:

示例代码

输出信息到控制台

输出信息到指定的 html 元素

属性配置

-- -------------------- ---- -------
------ ---- ---- ---------

----------
  ----- -------------------------------
  ------ -
    ------ ----------
  -
---

------------ --------
展开代码

输出对象

以上代码将输出 { a: 1, b: '2' }。如果用默认配置,将输出 {"a":1, "b":"2"}

来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/6005601981e8991b448de422

纠错
反馈

纠错反馈