Code Monkey home page Code Monkey logo

nutui's Introduction

nutui logo

NutUI

version license

基于Vue 2.0的移动端轻量级UI组件库

安装

推荐使用npm安装NutUI
npm install @nutui/nutui --save

引用完整组件库

1,在webpack入口文件(如app.js或main.js)中引入
import NutUI from '@nutui/nutui'

2,初始化
NutUI.install(Vue)

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

自定义构建(按需引用)

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

1,在NutUI项目目录下执行
npm install

2,执行自定义构建命令
npm run custom

3,在出现的组件列表中,选择所有您需要打包的组件,然后按下回车键即开始构建

4,片刻之后,自定义构建出的nutui.js文件会出现在dist目录下

5,在项目中引入和初始化的操作同上

组件用法

组件从使用方法上大致分为两类。
  • 一类是扩展 HTML 元素,典型的Vue组件形式,使用方式类似原生HTML元素。
如遮罩层(Mask)组件,直接使用nut-mask标签即可
<nut-mask :visible.sync="maskShow"><nut-mask>
  • 另一类是挂在Vue.prototype上的实例方法,在需要的地方调用即可。
如对话框(Dialog)组件
this.$dialog(options);
提示框(Toast)组件
this.$toast(msg,during);

每个组件的使用方式请参考具体组件文档

联系我们

[email protected]

License

MIT

nutui's People

Contributors

franslee avatar irissong avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.