当前版本号:1.3.2(组件数量:58)

NutUI是一套拥有电商基因的基于Vue2.0的轻量级移动端开源组件库,大部分组件来自「京东APP」、「京东ME」、「京东M站」中的实际项目。
安装

1,推荐使用npm安装NutUI

  1. npm install @nutui/nutui --save

2,通常在webpack入口页面(app.js或main.js)引用完整组件库

  1. import NutUI from '@nutui/nutui'

3,初始化

  1. NutUI.install(Vue)

通过以上步骤即可完成整个NutUI组件库的安装。

自定义构建(按需引用)

本组件库支持自定义构建(1.1.0版本以上),您可以根据需要只打包部分组件。

1,在NutUI项目目录下执行

  1. npm install

2,执行自定义构建命令

  1. npm run custom

3,在列表中,选择所有您需要打包的组件,然后按下回车键即开始构建
指南 - 图1
4,片刻之后,自定义构建出的nutui.js文件会出现在dist目录下。在项目中引入和初始化的操作同上

使用方法

使用方法大致分为两类。

1,扩展 HTML 元素,典型的Vue组件形式,使用方式类似原生HTML标签。如遮罩层(Mask)组件,直接使用标签即可。

  1. <nut-mask
  2. :visible.sync="maskShow">
  3. </nut-mask>

2,挂在Vue.prototype上的实例方法,在需要的地方调用即可。如对话框(Dialog)组件。

  1. this.$dialog(options);

提示框(Toast)组件

  1. this.$toast(msg,during);
联系我们

如果您在使用组件的过程中遇到了什么问题,或者有什么意见建议,都欢迎与我们联系:nutui@jd.com

使用项目

点击查看正在使用项目。如果您在项目里使用了NutUI,欢迎告知。