首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >有一种方法可以在组件之外的recoilJS上更新状态吗?

有一种方法可以在组件之外的recoilJS上更新状态吗?
EN

Stack Overflow用户
提问于 2020-06-06 09:27:49
回答 2查看 2.2K关注 0票数 4

因此,我正在为一个js游戏尝试recoilJS,它非常整洁,但是从组件中更新原子的需求只是一个限制。

为了创建一个游戏循环,我把所有的逻辑放在空组件上,这样我就能够读和写状态。即使我要在组件之外构建登录,我也需要随时移动不同的状态。有一种方法可以更新反应组件之外的原子(不是通过钩子)?

EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2020-06-14 17:48:29

现在还没有。为后坐力小组打开了一个建议。

票数 2
EN

Stack Overflow用户

发布于 2020-09-01 06:01:22

我使用RXJS帮助设置组件外部的RecoilJS值。

在开始时,我创建了4个部分

  1. 主要部件
  2. RecoilJS组件
  3. 原子文件
  4. 设置组件文件的RecoilJS外部值

1).Main

代码语言:javascript
复制
import React from 'react';
import {
  RecoilRoot
} from 'recoil';

function App() {
  return (
    <RecoilRoot>
      <MainScreens />
      <RecoilJSComponent/>
    </RecoilRoot>
  );
}

2).RecoilJS组件

代码语言:javascript
复制
import React from 'react';
import {
    useRecoilCallback
} from 'recoil';
import { Subject } from 'rxjs';

export const setRecoil = new Subject();

const getRecoil = new Subject();
const returnRecoil = new Subject();

export const promiseGetRecoil = (recoilObj) => {
    return new Promise(async (resolve, reject) => {
        getRecoil.next(recoilObj)
        returnRecoil.subscribe({
            next: (value) => {
                if (recoilObj === value.recoilObj) {
                    resolve(value.value)
                }
            }
        });
    })
 }

export default function RecoilJSComponent() {

    const setStore = useRecoilCallback(({ set }) => (n) => {
        set(n.recoilObj, () => (n.value));
    }, [])

    const getStore = useRecoilCallback(({ snapshot }) => async (recoilObj) => {
    
    const valueRecoilObj = await snapshot.getPromise(recoilObj);
    returnRecoil.next({ recoilObj: recoilObj, value: valueRecoilObj })

 }, [])

    setRecoil.subscribe({
        next: (value) => {
            setStore(value)
        }
    });

    getRecoil.subscribe({
        next: (recoilObj) => {
            getStore(recoilObj)
        }
    });

    return null;
}

3).Atom文件

代码语言:javascript
复制
export const textState = atom({
  key: 'textState'
  default: ''
});

4)组件文件值外的.set RecoilJS

代码语言:javascript
复制
import API from './Api';
import { setRecoil } from './RecoilJSComponent'
import { textState } from './textState'

export const setValueReCoil = () => {

    API()
        .then(result => {

           setRecoil({ recoilObj: textState, value: result })

        })
        .catch(ex => {
        
        })
};

主要神像是2和4。

在第2部分中,我使用RXJS通过组件设置值,并导出RXJS以在组件外部的RecoilJS上设置一个值。

我希望我的偶像能帮助你解决你的问题

票数 7
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/62229781

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档