# react-mhoc

> React高阶组件

Latest version **1.2.7** (published 2018-06-30) · MIT license · 0 weekly downloads

## Install

```sh
npm install react-mhoc
pnpm add react-mhoc
yarn add react-mhoc
bun add react-mhoc
```

## Health

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

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.2.7 |
| Published | 2018-06-30 |
| First published | 2017-08-01 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 2 |
| Unpacked size | 557 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 8 |
| Maintainers | moyuyc |

## Links

- npm: https://www.npmjs.com/package/react-mhoc
- Repository: https://github.com/moyuyc/react-hoc
- Homepage: https://github.com/moyuyc/react-hoc#readme
- Issues: https://github.com/moyuyc/react-hoc/issues
- npm.io page: https://npm.io/package/react-mhoc

## Dependencies (2)

- [classname](https://npm.io/package/classname.md) 0.0.0
- [hoist-non-react-statics](https://npm.io/package/hoist-non-react-statics.md) ^2.3.1

## Recent versions

- 1.2.7 (latest) — 2018-06-30
- 1.2.6 — 2017-09-03
- 1.2.5 — 2017-09-02
- 1.2.4 — 2017-09-02
- 1.2.3 — 2017-08-12
- 1.2.2 — 2017-08-12
- 1.2.1 — 2017-08-09
- 1.2.0 — 2017-08-08
- 1.1.9 — 2017-08-06
- 1.1.8 — 2017-08-06
- 1.1.7 — 2017-08-05
- 1.1.6 — 2017-08-05
- 1.1.5 — 2017-08-05
- 1.1.4 — 2017-08-05
- 1.1.3 — 2017-08-05
- … 5 more at https://npm.io/package/react-mhoc/versions

## README

# react-mhoc

React高阶组件

1. style-useable.js

`componentWillMount` 触发 `style.use`  
`componentWillUnmount` 触发 `style.unuse`

```jsx
import {styleUseable} from 'react-mhoc'
import style from './style.use.less'

@styleUseable(style)
class MyComponent extends React.Component {
    // ....
}
```

2. editable.js

可同步编辑props/state/...内部数据
![](http://obu9je6ng.bkt.clouddn.com/FkVW1A_OJ5Nw5m2wNFQL5QrtIGfF?imageslim)

[Demo](https://m-cuttlefish.github.io/react-mhoc/page/)

- 参数
    - groupName: string  
        编辑视图的组名(默认为组件名)
    - attrNames: Array  
        需要编辑的数据keyNames, props强制支持 (默认['state'])

```jsx
import {editable} from 'react-mhoc'

@editable
class MyComponent extends React.Component {
    // ....

    // ref Api
    open() {}
}


class App extends React.Component {

    componentDidMount() {
        // not existed open
        // this.ref.open()

        // ok
        this.ref.comp.open()
    }

    render() {
        <MyComponent ref={r => this.ref = r} />
    }
}
```


## ChangeLog

- 1.2.1 
    1. 支持Array/Object的新增和删除
    2. 代码简单重构
    
- 1.2.2
    1. 添加 Hover 高亮
    2. 添加 View 按钮

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