https://github.com/bramblex/react-hooks

React Hooks API 在 16.6 上面的模拟实现
https://github.com/bramblex/react-hooks

Last synced: about 1 month ago
JSON representation

React Hooks API 在 16.6 上面的模拟实现

• Host: GitHub
• URL: https://github.com/bramblex/react-hooks
• Owner: bramblex
• Created: 2018-11-18T08:58:52.000Z (about 6 years ago)
• Default Branch: master
• Last Pushed: 2022-04-04T17:34:10.000Z (over 2 years ago)
• Last Synced: 2024-10-06T09:13:28.492Z (2 months ago)
• Language: TypeScript
• Size: 35.2 KB
• Stars: 96
• Watchers: 3
• Forks: 15
• Open Issues: 1
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

• awesome-github-star - react-hooks

README

        
# react-hooks

React Hooks API 在低版本 React 16.6 下面的一个实现，可以在不升级 React 版本的前提下体验新的 React Hooks API。

## Install

```

npm install blx-react-hooks

# or

yarn add blx-react-hooks

```

## Usage

在声明函数式组件的时候，通过用 `withHooks()` 函数封装就可以就使用 Hooks API 了。与 React 的 Hooks API 只差了需要 `withHooks()` 函数进行封装。

```JSX

import {withHooks, useState} from 'blx-react-hooks'

// 如果想在调试的时候看到组件名，定义function的时候必须要定义成一个命名函数

const Counter = withHooks(function Counter({title, initCount}) {

  const [count, setCount] = useState(initCount)

  return (

    


      
{title} 

       setCount(count - 1)}> - 

      Count: {count}

       setCount(count + 1)}> + 

    

  )

})

```


完整示例 [https://github.com/bramblex/react-hooks/blob/master/example.html](https://github.com/bramblex/react-hooks/blob/master/example.html)

## API

* withHooks

* useState / useReducer

* useEffect / useLayoutEffect

* useContext

* useRef / useImperativeMethods

* useMemo / useCallback

## Document

API 的文档直接参见 React Hooks API 的文档：[https://reactjs.org/docs/hooks-intro.html](https://reactjs.org/docs/hooks-intro.html)