the-cycle v1.0.2

the-cycle

Component with life cycle

Installation

$ npm install the-cycle --save

Usage

'use strict'

import React from 'react'
import { TheCycle } from 'the-cycle'

class ExampleComponent extends React.Component {
  state = {
    tickAt: null,
    tickCount: 0,
    someOtherValue: 'foo'
  }

  onMount = () => {
    this.tickTimer = setInterval(() => this.setState({
      tickAt: new Date(),
      tickCount: this.state.tickCount + 1
    }), 1000)
  }

  onUnmount = () => {
    clearTimeout(this.tickTimer)
  }

  onReceive = (diff, currentValues, prevValues) => {
    console.log('received', diff)
  }

  render () {
    return (
      <div>
        <TheCycle onMount={this.onMount}
                  onUnmount={this.onUnmount}
                  onReceive={this.onReceive}
                  values={this.state}
        >
          <h3>This a cycled component</h3>
          <pre>{JSON.stringify(this.state, null, 2)}</pre>
        </TheCycle>
      </div>

    )
  }
}

export default ExampleComponent

Components

TheCycle

Component with life cycle

Props

License

This software is released under the MIT License.

Links

• THE Labo