@actorize/react 中文文档教程

发布于 3年前 浏览 9 项目主页 更新于 3年前

@actorize/react

[gzip size]()

这只是 @actorize/core

Getting Started

$ npm install @actorize/react
# or
$ yarn add @actorize/react
import { ActorizeProvider, useActorize } from '@actorize/react';
import {
  dispatch
} from '@actorize/core';
import director from './director';
// ...

const MyCoolActor = () => {
  const [state, setState] = useSate(0)

  const actor = useActorize('cool-actor', {
    onMessage: (msg) => {
      if (msg.payload === 'INC') {
        setState(state + 1)
      }
    },
  });

  return (
    <div>
      {state}
    </div>
  )
}

const ThatBigButton = () => {
  const handleClick = () => {
    dispatch(director, 'cool-actor', 'INC');
  }
  return (
    <button onClick={handleClick} >Click Me</button>
  )
}

const Wrapper = () => (
  <ActorizeProvider director={director}>
    <MyCoolActor />
    <ThatBigButton />
  </ActorizeProvider>
)

@actorize/react

[gzip size]()

this is just the React Extension for @actorize/core

Getting Started

$ npm install @actorize/react
# or
$ yarn add @actorize/react
import { ActorizeProvider, useActorize } from '@actorize/react';
import {
  dispatch
} from '@actorize/core';
import director from './director';
// ...

const MyCoolActor = () => {
  const [state, setState] = useSate(0)

  const actor = useActorize('cool-actor', {
    onMessage: (msg) => {
      if (msg.payload === 'INC') {
        setState(state + 1)
      }
    },
  });

  return (
    <div>
      {state}
    </div>
  )
}

const ThatBigButton = () => {
  const handleClick = () => {
    dispatch(director, 'cool-actor', 'INC');
  }
  return (
    <button onClick={handleClick} >Click Me</button>
  )
}

const Wrapper = () => (
  <ActorizeProvider director={director}>
    <MyCoolActor />
    <ThatBigButton />
  </ActorizeProvider>
)
    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
    原文