0.1.28 • Published 5 years ago
@render-props/value v0.1.28
Value
A state container which provides an interface for setting single values.
Installation
yarn add @render-props/value
or npm i @render-props/value
Usage
import Value from '@render-props/value'
function ValueSetter () {
return (
<Value initialValue='foo'>
{({setValue, clearValue, resetValue, value}) => (
<>
<button onClick={() => setValue(value === 'foo' ? 'bar' : 'foo')}>
Change value to '{value === 'foo' ? 'bar' : 'foo'}'
</button>
<button onClick={clearValue}>
Make value 'undefined'
</button>
<button onClick={resetValue}>
Reset value to initialValue
</button>
</>
)}
</Value>
)
}
Props
initialValue {any}
: the initial value of the component. This creates an uncontrolled component.value {any}
: the value of the component. This creates a controlled component which derives its state value from propsonChange {func}
: a callback which is invoked each time the value changes. Receives the new value as its only argument.
Render Props
Methods
setValue
(value <!== undefined>)
: sets state.value to@value
. You can also provide a function here, the return value of which will be the new value that gets set. The function receives two arguments,(currentValue, props)
.resetValue
: sets value to theinitialValue
propclearValue
: sets value toundefined
State
value {any}
: the current value in the state
0.1.28
5 years ago
0.1.27
5 years ago
0.1.26
5 years ago
0.1.25
5 years ago
0.1.24
6 years ago
0.1.23
6 years ago
0.1.22
6 years ago
0.1.21
6 years ago
0.1.20
6 years ago
0.1.19
6 years ago
0.1.18
6 years ago
0.1.17
6 years ago
0.1.16
6 years ago
0.1.15
6 years ago
0.1.14
6 years ago
0.1.13
6 years ago
0.1.12
6 years ago
0.1.11
6 years ago
0.1.10
6 years ago
0.1.9
6 years ago
0.1.8
6 years ago
0.1.7
6 years ago
0.1.6
6 years ago
0.1.5
6 years ago
0.1.4
6 years ago
0.1.3
6 years ago
0.1.2
6 years ago
0.1.1
6 years ago
0.1.0
6 years ago