# mor-mobile

> Mona系列 - React移动端组件库

Latest version **0.6.3** (published 2018-09-03) · 0 weekly downloads

## Install

```sh
npm install mor-mobile
pnpm add mor-mobile
yarn add mor-mobile
bun add mor-mobile
```

## Health

**Score 10/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; low quality score; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.6.3 |
| Published | 2018-09-03 |
| First published | 2018-03-14 |
| Weekly downloads | 0 |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 3 |
| Unpacked size | 202 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | yangxi |
| Maintainers | yangxi |
| Keywords | mor, mor-mobile, react H5, react UI, mobile UI |

## Links

- npm: https://www.npmjs.com/package/mor-mobile
- Repository: https://github.com/func-star/mor-mobile
- Homepage: https://github.com/func-star/mor-mobile#readme
- Issues: https://github.com/func-star/mor-mobile/issues
- npm.io page: https://npm.io/package/mor-mobile

## Dependencies (3)

- [classnames](https://npm.io/package/classnames.md) 2.2.5
- [mona-events](https://npm.io/package/mona-events.md) 0.0.5
- [jsx-control-statements](https://npm.io/package/jsx-control-statements.md) 3.1.2

## Recent versions

- 0.6.3 (latest) — 2018-09-03
- 0.6.2 — 2018-08-29
- 0.6.1 — 2018-08-29
- 0.6.0 — 2018-08-23
- 0.5.2 — 2018-08-23
- 0.5.1 — 2018-08-23
- 0.5.0 — 2018-08-23
- 0.4.0 — 2018-08-23
- 0.3.0 — 2018-08-22
- 0.2.0 — 2018-08-20
- 0.1.0 — 2018-08-18
- 0.0.2 — 2018-07-07
- 0.0.1 — 2018-03-14

## README

# 一款让你感到幸福的 React 组件库

✨✨这是 Mona 系列的 React 实现，服务于移动端 H5 产品。

[![npm](https://img.shields.io/npm/v/mor-mobile.svg?style=flat-square)](https://www.npmjs.com/package/mor-mobile) [![npm](https://img.shields.io/npm/dt/mor-mobile.svg?style=flat-square)](https://www.npmjs.com/package/mor-mobile) 

- [主页](http://home.mor.monajs.cn)

- [手机访问](http://mor.monajs.cn)

## 大致介绍

这是一款轻量级 React 组件库，拥有非常强的可扩展性和自定义功能。

你完全可以根据自己的需要自定义主题样式、组件样式，你也可以根据业务需要扩展组件功能。

可以满足你各种姿势，给你提供各种体位。


### 依赖

- [classnames](https://www.npmjs.com/package/classnames)
- [jsx-control-statements](https://www.npmjs.com/package/jsx-control-statements)
- [mona-events](https://www.npmjs.com/package/mona-events)

## 安装

### NPM

```bash
npm i mor-mobile --save
```

### 按需加载

- 使用 babel-plugin-import（推荐用法）

`babel-plugin-import` 是一款 `babel` 插件，它会在编译过程中将 `import` 的写法自动转换为按需引入的方式

```bash
# 安装 babel-plugin-import 插件
npm i babel-plugin-import -dev
```

```js
.babelrc or babel-loader option
{
  "plugins": [
    ["import", {
      "libraryName": "mor-mobile",
      "libraryDirectory": "lib",
      "style": true // 加载 less 文件
    }]
  ]
}
```

- 手动引入

```js
import DatePicker from 'mor-mobile/lib/modal';  // 加载 JS
import 'mor-mobile/lib/modal/style';         // 加载 LESS
```

✨✨你也可以为`mor-mobile` 起一个别名，让代码变的更好看一点

```
// webpack 添加解析配置
...js
resolve: {
	extensions: ['.js', '.jsx'],
	alias: {
		'mona': path.resolve('./node_modules/mor-mobile')
	}
}
...
```

```js
.babelrc or babel-loader option
{
  "plugins": [
    ["import", {
      "libraryName": "mona",
      "libraryDirectory": "lib",
      "style": true // 加载 less 文件
    }]
  ]
}
```



### 开始使用
接着你可以在代码中直接引入 Mor-mobile 组件

```js
import { Row, Col } from 'mona';
```


## 联系我
> 微信：599321378


### TODO

* toast，添加隐藏回调
* listView添加头部尾部自定义
* loading修改阴影样式
* 通用修改动画

* Row Col 支持一下offset

* Toast 支持蒙层cancel，默认可点击
* Toast 支持自定义图片
* Toast 支持api方法
* Toast 支持同时提示多个

* ListView 支持自定义头部和底部

* DatePicker 支持disable日期
* DatePicker 支持api方法

---
_Source: https://npm.io/package/mor-mobile · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._