An open API service indexing awesome lists of open source software.

https://github.com/crapthings/react-wormhole

This hoc open a tunnel between react component.
https://github.com/crapthings/react-wormhole

Last synced: about 1 year ago
JSON representation

This hoc open a tunnel between react component.

Awesome Lists containing this project

README

          

### how to use

> the wrapped class component will have a wormhole method. it can access all methods and state, prop etc...

```js
this.wormhole()
this.wormhole('namespace')
this.wormhole(['namespace1', 'namespace2'])
```

```jsx
import React, { Component } from 'react'
import { render } from 'react-dom'
import withWormhole from '../dist'

@withWormhole('root')
class Root extends Component {
state = {
ts: Date.now()
}

componentWillUpdate() {
this.wormhole('changeRootTs').setState({ ts: Date.now() })
}

render() {
return (


Root


{this.state.ts}



)
}
}

class Nest extends Component {
componentDidMount() {
console.log('Nest')
}

render() {
return (


Nest




)
}
}

class Nest1 extends Component {
componentDidMount() {
console.log('Nest1')
}

render() {
return (


Nest1




)
}
}

@withWormhole('changeRootTs')
class Nest2 extends Component {
state = {
ts: null
}

onClick = evt => {
this.wormhole('root').setState({ ts: Date.now() })
}

render() {
return (


Nest2


Change Root Timestamp {this.state.ts}

)
}
}

render(, document.getElementById('root'))
```