react-hook-post-robot

It's easy to use "robot-post" on React's components.

Usage no npm install needed!

<script type="module">
  import reactHookPostRobot from 'https://cdn.skypack.dev/react-hook-post-robot';
</script>

README

react-hook-post-robot

It's easy to use "robot-post" on React's components.

NPM JavaScript Style Guide

Install

npm install --save react-hook-post-robot

Usage

import React, { useEffect, useState } from 'react'
import { usePostRobotOn, usePostRobotSend, PostRobotContext } from 'react-hook-post-robot'

const SampleComponentParent = (props) => {
  // In fact, you can specify an contentWindow of iframe.
  // You can fix the window under the Context.
  return <PostRobotContext.Provider value={{ window }} {...props} />
}

const SampleComponentChild = () => {
  const [state, setState] = useState(null)

  // Instead of postRobot.on('test', () => message)
  usePostRobotOn('test', () => {
    return 'Hello, react-hook-post-robot!'
  }, [])

  // Instead of postRobot.send('test', ({ data }) => setState(data))
  const sender = usePostRobotSend('test')
  useEffect(() => {
    sender().then(({ data }) => setState(data))
  }, [])

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

const App = () => {
  return (
    <SampleComponentParent>
      <SampleComponentChild />
    </SampleComponentParent>
  )
}

export default App

License

MIT © aiji42

Inspiration

This library is inspired by:


This hook is created using create-react-hook.