@rcp/use.shared
    TypeScript icon, indicating that this package has built-in type declarations

    1.1.5 • Public • Published

    @rcp/use.shared

    NPM version NPM Downloads

    shared value like recoil

    Installation

    npm install @rcp/use.shared
    # or use yarn
    yarn add @rcp/use.shared

    Usage

    import { useShared, SharedProvider, useSharedProvider } from '@rcp/use.shared'
    
    const Content = React.memo(({ symbol = fetchData }) => {
      // 必须使用唯一方法 ref,孩子获取数据
      const [data] = useShared(symbol)
      return <pre>{JSON.stringify(data, null, 2)}</pre>
    })
    
    const syncData = {
      wow: 123
    }
    const dynamicData = async (name) => ({
      wow: name
    })
    const Layout = ({ symbol = syncData }) => {
      // 提供数据,可以是静态数据,也可以是动态数据(同步或异步)
      // useSharedProvider(dynamicData, {}, [name])
      useSharedProvider(symbol, {}, [])
      return (
        <>
          <Content symbol={symbol} />
          <NoEffectComp />
        </>
      )
    }
    
    const NoEffect = jest.fn(() => {
      return null
    })
    const NoEffectComp = React.memo(NoEffect)
    
    const App = ({ symbol }: any) => {
      // SharedProvider 用于提供共享数据存储载体,一般在 React Element Root 注入
      return (
        <SharedProvider>
          <Layout symbol={symbol} />
        </SharedProvider>
      )
    }

    API

    useShared

    数据获取,用于获取 useSharedProvider 共享的数据

    Related

    Authors

    This library is written and maintained by 余聪, yucong@yuanfudao.com.

    License

    MIT

    Install

    npm i @rcp/use.shared

    DownloadsWeekly Downloads

    23

    Version

    1.1.5

    License

    MIT

    Unpacked Size

    28.9 kB

    Total Files

    14

    Last publish

    Collaborators

    • moyuyc