npm 包 @captemulation/insight-ui 使用教程

介绍

@captemulation/insight-ui 是一个基于 Vue.js 的前端组件库,主要用于展示数据面板、图表、表格等常见组件,可以方便地用于数据可视化的项目中。

安装

可以通过 npm 直接安装:

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

或者使用 yarn:

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

使用

全局注册

通过 Vue.use 全局注册:

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

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

局部注册

在需要使用的组件处进行局部注册:

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

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

示例代码

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

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

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

总结

@captemulation/insight-ui 组件库提供了丰富的前端组件,可以方便地用于数据可视化的项目中,使用起来也非常简单。希望这篇教程对您有所帮助。

来源:JavaScript中文网 ,转载请联系管理员! 本文地址:https://www.javascriptcn.com/post/600556f081e8991b448d3d2f


猜你喜欢

  • npm 包 safe-nude 使用教程

    在前端开发中,处理图片是非常常见的任务,但有时候图片可能包含不适宜展示的内容,这时候就需要使用一些工具来检测图片,如npm包 safe-nude。本教程将为你介绍如何使用safe-nude来检测图片中...

    2 年前
  • npm 包 generator-mirror 使用教程

    在前端开发中,使用 Yeoman 可以帮助我们快速生成项目框架和工程文件。Yeoman 是一个基于 Node.js 的开源项目脚手架工具,它利用代码生成器帮助你快速搭建一个拥有完美结构的项目。

    2 年前
  • npm 包 rc-content-loader 使用教程

    介绍 rc-content-loader 是一个 React 组件,用于在页面加载数据时,显示一个占位符,增加用户体验。该组件支持多种类型的占位符,可自定义样式,简单易用。

    2 年前
  • npm 包 sinopia-current 使用教程

    前言 npm 是 Node.js 的包管理器,提供了非常方便的包安装和管理功能。而 sinopia 是一个私有 npm 仓库,可以让我们在局域网内搭建一个私有的 npm 仓库,方便团队内部共享开发资源...

    2 年前
  • npm 包 task-node 使用教程

    在前端开发中,我们经常需要进行一些自动化的任务,例如压缩、打包、测试等。而 task-node 就是一个基于 Node.js 的自动化任务管理工具,可以轻松地执行这些任务。

    2 年前
  • npm 包 mapmyindia-sdk-nodejs 使用教程

    介绍 MapmyIndia 是印度领先的地理信息提供商,提供了许多地理位置相关的服务和解决方案。MapmyIndia SDK 是他们提供的一个用于在应用中使用地图和位置服务的工具包,其中 mapmyi...

    2 年前
  • npm包Qlite使用教程

    在前端开发中,我们经常需要在浏览器中操作本地的数据库,以储存数据以及提高网页应用程序的性能。为了更加方便地操作本地数据库,诸如SQLite、IndexedDB 和WebSQL 等数据库已经得到广泛的应...

    2 年前
  • npm包awesome-fontmin-loader使用教程

    介绍 awesome-fontmin-loader是一个基于Webpack的字体优化工具。它可以将网站使用的字体进行压缩和精简,从而提高网站的加载速度和性能。awesome-fontmin-loade...

    2 年前
  • npm 包 minio-db-client 使用教程

    简介 minio-db-client 是一款基于 Node.js 的 npm 包,用于连接和操作 minio 对象存储中的数据库。相比传统的关系型数据库,minio-db-client 支持多节点分布...

    2 年前
  • npm 包 user-mysql 使用教程

    前言 使用 MySQL 进行 web 应用开发时,操作数据库是常见需求之一。但是,手写 SQL 语句较繁琐,并且容易导致代码可读性下降以及注入攻击。因此,使用 ORM 库进行数据库操作是更好的选择。

    2 年前
  • npm 包 finboxio-redoc 使用教程

    在前端开发中,API 文档是非常重要的。finboxio-redoc 是一个使用 OpenAPI/Swagger 规范生成的现代化的文件查看器。该库可以动态地将你的 API 文档渲染成易于阅读的 HT...

    2 年前
  • npm 包 @fand/async-node 使用教程

    简介 在前端开发中,异步操作和回调函数是无法避免的。async-node 是一个 npm 包,提供了一种方便快捷的处理异步操作的方式。它可以让开发者避免部分回调函数的使用,并且在异步操作上提供了更加灵...

    2 年前
  • npm 包 joi-extension-string-coerce 使用教程

    前言 在前端开发中,表单验证是非常重要的一部分。Joi 是一个流行的 JavaScript 验证库,它提供了可扩展、强大的验证机制。虽然 Joi 本身功能强大,但是使用时还有一些限制,例如常常需要手动...

    2 年前
  • npm 包 morgan-cli 使用教程

    在前端开发的过程中,打印日志是必不可少的一个环节。而 morgan-cli 就是一个可以帮助开发者打印服务器日志的 npm 包。 在本文中,我们将会详细介绍 morgan-cli 的使用方法,以及介绍...

    2 年前
  • npm 包 eslint-config-servicenav 使用教程

    前言 在前端开发中,我们往往会使用大量的 JavaScript 代码进行开发。为了保证代码的质量和规范,我们需要借助工具来对代码进行检查和校验。其中一个不可或缺的工具就是 eslint。

    2 年前
  • npm 包 injectify-jest 使用教程

    介绍 injectify-jest 是一个基于 Jest 框架的 npm 包,能够在测试中使用自动化 DOM 操作工具,如自动填入表单、点击按钮等。 安装 你可以使用以下命令安装 injectify-...

    2 年前
  • npm 包 eslint-config-rq 使用教程

    在现代化的前端开发中,使用代码检查工具能够帮助我们保持代码质量、减少 bug 数量,更好的团队合作等等。eslint 便是一个非常流行的 JavaScript 代码检查工具。

    2 年前
  • npm 包 beeh5maker 使用教程

    前言 随着现代 Web 技术的不断发展,前端在开发速度、交互体验等方面也越来越得到重视。其中,制作 H5 广告页已成为不可忽视的一部分。近来,越来越多的前端工程师试图寻找一款能够方便、快捷地制作 H5...

    2 年前
  • npm 包 myfarms-angular2-datatable 使用教程

    前言 在前端开发中,数据表格是一个非常常见的组件。为了更方便地实现数据表格的使用,myfarms-angular2-datatable 诞生了。本文将带您深入了解如何使用这个 npm 包,并附有实用的...

    2 年前
  • npm 包 drupal-bower 使用教程

    简介 在搭建网站或者应用的过程中,前端资源的使用是必不可少的。而我们常常会用到依赖管理工具 npm 和 bower。但是在使用中,我们也会面临一些问题,比如某些依赖的版本出现了兼容性问题等等。

    2 年前

相关推荐

    暂无文章