有没有办法在组件外部更新后坐力JS的状态?



所以我正在为我正在构建的js游戏尝试recoilJS,它非常整洁,但是需要从组件更新原子只是感觉像是一种限制。

为了创建游戏循环,我将所有逻辑放在空组件上,以便能够读取和写入状态。即使我将在组件之外构建登录名,我也需要特别经常移动不同的统计数据。有一种方法可以在反应组件之外更新原子(不是通过钩子(?

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

一开始,我创建了 4 个部分作为

  1. 主要部件
  2. 后坐力JS组件
  3. 原子文件
  4. 设置组件文件的后坐力JS外部值

1(.主要

import React from 'react';
import {
RecoilRoot
} from 'recoil';
function App() {
return (
<RecoilRoot>
<MainScreens />
<RecoilJSComponent/>
</RecoilRoot>
);
}

2(.后坐力JS组件

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(.原子文件

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

4(.在组件文件的值之外设置反冲JSs

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 上设置值

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

现在没有。为后坐力团队打开了一个建议。

最新更新