Questions tagged [recoiljs]

A state management library for React.

Recoil is a minimal library that provides an experimental set of utilities for state management with React.

  • Minimal and Reactish: Recoil works and thinks like React. Add some to your app and get fast and flexible shared state.
  • Data-Flow Graph: Derived data and asynchronous queries are tamed with pure functions and efficient subscriptions.
  • Cross-App Observation: Implement persistence, routing, time-travel debugging, or undo by observing all state changes across your app, without impairing code-splitting.

Recoil lets you create a data-flow graph that flows from atoms (shared state) through selectors (pure functions) and down into your React components. Atoms are units of state that components can subscribe to. Selectors transform this state either synchronously or asynchronously.


Useful links


Related tags


Reference

268 questions
3
votes
2 answers

Is there a proven way to manage a collection of atoms in Recoil?

I'm testing Recoil and I need to manage a list of posts to display in the homepage. My first idea was to make a big Atom with all the posts, but this seems a bit violent as we can edit posts directly on the homepage. My second idea was to…
Xiiryo
  • 3,021
  • 5
  • 31
  • 48
3
votes
1 answer

useEffect triggered by recoil state doesn't work as expected in safari

I want to trigger input type="file" click when state outside the component has changed. When updated state is passed as prop and useEffect function is excecuted everything work as expected. When updated state is passed as useRecoilState it seems…
Żywy
  • 393
  • 2
  • 12
3
votes
2 answers

inputFile.current.click() inside useEffect doesn't work in safari

I have and want to trigger .click() on that input. Everything works fine in chrome, firefox, edge but problem exists in safari. When I click on button to trigger inputFile.current.click() - it works. But when it happens inside…
Żywy
  • 393
  • 2
  • 12
3
votes
3 answers

How to manipulate a global state outside of a React component using Recoil?

I'm using Recoil, and I'd like to access the store outside a component (get/set), from within a utility function. More generally, how do people write re-usable functions that manipulate a global state with Recoil? Using Redux, we can dispatch events…
Vadorequest
  • 16,593
  • 24
  • 118
  • 215
3
votes
1 answer

How to write test code for custom hook using recoil

I'm writing a test code with Jest for a custom hook in my web application. It uses Recoil for state management, but the error message appears when I run npm run test. This is the error message. This component must be used inside a
Satoru Kikuchi
  • 1,069
  • 2
  • 21
  • 33
3
votes
1 answer

Post data through API with RecoilJS

In RecoilJS docs, there is an example how to handle asynchronous data queries, but it's only about get data. Let say I have a simple state: const accountState = atom({ key: "accountState", default: { id: "", name: "", } }); And a…
Trí Phan
  • 1,123
  • 2
  • 15
  • 33
3
votes
1 answer

Recoil JS - getting rid of the suspense re-rendering my app

I am experimenting with Recoil in a React framework I am currently building. In my use case, the application will produce an action object based on user activities, and then it will send it to the server, from where it will get the application…
Ivaylo Slavov
  • 8,839
  • 12
  • 65
  • 108
2
votes
0 answers

Error when using the next.js API with RecoilJS

I'm trying to initialise a Recoil atom using the Next API but encountering an error. The default value is set to the function that makes the call to the Next API endpoint, which then retrieves some data from firebase. When I then try to use the atom…
joel
  • 21
  • 2
2
votes
0 answers

Dynamically creating stores in Svelte

Is it possible to have a Recoil-esque state management solution in Svelte? I have an app where there is a "canvas" (just a div) that renders multiple elements. These elements (svgs or divs) are moveable/draggable/rotatable etc. If I used a single…
2
votes
1 answer

Recoil Nexus - Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got object

I started getting the error: error - Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object. at ReactDOMServerRenderer.render ... when…
YSLdev
  • 142
  • 1
  • 11
2
votes
1 answer

[Error: Invalid argument to useRecoilState: expected an atom or selector but got undefined]

I've been using React and Recoil since I've been walking, and this is such a simple issue that I just must not be seeing something obvious. I have a recoil state that gets populated upon a user signIn. It populated for sure because I tested this…
user18899735
2
votes
0 answers

How to use React Suspense without 504: GATEWAY_TIMEOUT

I'm using Recoil but it's resulting in the following warning: Warning: Can't perform a React state update on a component that hasn't mounted yet. This indicates that you have a side-effect in your render function that asynchronously later calls…
steven
  • 51
  • 3
2
votes
0 answers

How to have filtered atomFamily with selectFamily using recoil

I have the following code: import { atom, atomFamily, selector, selectorFamily } from 'recoil'; import { VIDEO_STATUSES } from '../../constants'; export const videosDict = atomFamily({ key: 'videos', default: {}, }); export const videoIds =…
PGT
  • 1,468
  • 20
  • 34
2
votes
2 answers

React with Recoil, large array is lagging because of many re-renders

I have an array of objects, around 400 items. The component tree looks something like this App -> Page (useRecoilState(ListAtom) for consumption) -> List -> Item (useSetRecoilState(ListAtom) for mutation) -> Information …
PGT
  • 1,468
  • 20
  • 34
2
votes
1 answer

React: Dynamic number of stateful items, AKA dealing with "Rendered more hooks than during the previous render"

I'm trying to build a tree based forum similar to reddit and hackernews. I'm using react and recoil to manage state. I'm not sure if recoil is necessary for this particular problem as the state exists within a single page, but I'm open to using it…
boxerman81
  • 41
  • 6
1 2
3
17 18