21 lines
573 B
JavaScript
21 lines
573 B
JavaScript
|
import React, { Component } from 'react'
|
||
|
|
/* First we import the consumer */
|
||
|
|
import { CounterConsumer } from '../components/CounterProvider'
|
||
|
|
|
||
|
|
export default class index extends Component {
|
||
|
|
render () {
|
||
|
|
return (
|
||
|
|
/* Then we use our context through render props */
|
||
|
|
<CounterConsumer>
|
||
|
|
{({ count, increase, decrease }) => (
|
||
|
|
<div>
|
||
|
|
<p>Counter: {count}</p>
|
||
|
|
<button onClick={increase}>Increase</button>
|
||
|
|
<button onClick={decrease}>Decrease</button>
|
||
|
|
</div>
|
||
|
|
)}
|
||
|
|
</CounterConsumer>
|
||
|
|
)
|
||
|
|
}
|
||
|
|
}
|