React Wire basic concepts

Seyyed Morteza Moosavi — Tue, 29 Sep 2020 08:13:49 +0000

In this post, we will cover the @forminator/react-wire basic concepts.

Wire

A wire is an object that contained a value inside it.

The userWire hook, returns a new wire.

const wire = useWire(null, initialValue)

Or you can connect the wire to another wire, called an up-link wire. The value of both wires will be synced all the time.

const wire = useWire(anotherWire)

The useWireValue returns the current value of the wire, and rerender component when the wire value changed.

const value = useWireValue(wire)

The useWireState returns value and setValue. exactly same as default useState.

const [value, setValue] = useWireState(null, initialValue)

You can also pass a wire to the first argument, and the returned value will be synced with the wire.

const [value, setValue] = useWireState(wire, initialValue)

Seyyed Morteza Moosavi — Wed, 02 Sep 2020 09:52:45 +0000

connect react components with wire

The react-wire lib helps to develop a cleaner app, easy controlled/uncontrolled components, and beyond.

yarn add @forminator/react-wire