Skip to content

Latest commit

 

History

History
46 lines (32 loc) · 1.14 KB

redux.md

File metadata and controls

46 lines (32 loc) · 1.14 KB

Work together with Redux

It's easy! You can simply create Remini reactive variable from Redux store, and use it everywhere you want!

// ./remini-store.js
import { box, set } from 'remini'
import { store } from './redux-store'

export const $store = box(store.getState())

store.subscribe(() => {
  set($store, store.getState())
})

And you can make cached selectors for performance optimization reasons.

// ./remini-selectors.js
import { get, wrap } from 'remini'
import { $store } from './remini-store'

export const $user = wrap(() => get($store).user)

export const $fullName = wrap(
  () => `${get($user).firstName} ${get($user).lastName}`
);

And use it everywhere.

import { useBox } from 'remini/react'
import { $fullName } from './remini-selectors'

export const UserInfo = () => {
  const fullName = useBox($fullName)

  return <p>{fullName}</p>
}

As you can see, everything is quite simple and can be effectively used together!

Edit Redux with Remini