Mahdi N
Mahdi N

Reputation: 2178

How to integrate recoil library with react-native?

I'm trying the new state management library from facebook recoil, I tried the Getting started example on a reactjs project and it worked perfectly. After that I tried recoil on a react-native project but I got an error:

Error message

Here's the code I've tried:

App.js

import React from 'react';
import {RecoilRoot} from 'recoil';
import RecoilTest from './RecoilTest';

const App = () => {
  return (
    <RecoilRoot>
      <RecoilTest />
    </RecoilRoot>
  );
};

export default App;

RecoilTest.js

import React from 'react';
import {useRecoilState} from 'recoil';
import {View, Text} from 'react-native';
import {textState} from './Atoms';

const RecoilTest = () => {
  const [text, setText] = useRecoilState(textState);
  return (
    <View>
      <Text>{text}</Text>
    </View>
  );
};

export default RecoilTest;

Atoms.js

import {atom} from 'recoil';

export const textState = atom({
  key: 'textState',
  default: 'initial value',
});

Upvotes: 4

Views: 7967

Answers (5)

Yogesh Agrawal
Yogesh Agrawal

Reputation: 982

Update: RN support is now there in Recoil.js as Experimental.

https://github.com/facebookexperimental/Recoil/releases/tag/0.1.1

Upvotes: 2

Black
Black

Reputation: 10397

It is supported in nightly build. If you want to try before it is released with next version, you can install it doing:

yarn add https://github.com/facebookexperimental/Recoil.git#nightly

The update can be followed in this PR

Upvotes: 3

Yoel
Yoel

Reputation: 7985

Towards release

See here

Hi everyone! FYI we've published a "nightly build" branch for testing purposes. If you want to try out recoil with react native before we release next version, try install the nightly branch with the "install git branch" feature of npm/yarn:

npm install https://github.com/facebookexperimental/Recoil.git#nightly

Or yarn add https://github.com/facebookexperimental/Recoil.git#nightly

Upvotes: 2

hackemate
hackemate

Reputation: 537

Recoil don't has a fully support to react native yet

Upvotes: 3

divsoup
divsoup

Reputation: 1

Try using 'useRecoilValue' instead in your RecoilTest.js file

const [text, setText] = useRecoilValue(textState);

Upvotes: -2

Related Questions