1

我有一个 JS 服务，它的功能返回承诺。这些承诺使用 Realm DB 库。但是，每当我使用来自 React w/Redux Thunk 的动作创建者调用这些函数时，UI 就会冻结。我无法显示加载圈，无法拉出侧边栏，并且在 promise 解决之前后退按钮不起作用。一旦这样做，所有的触摸按键都会排队并立即执行，这使得它变得混乱。

如果我在 Realm DB 的异步（或缺乏）行为方面遗漏了一些基本的东西，请告诉我！将不胜感激。！

服务.js 
export {
    getProjects() {
        return Realm.open({ config.db }).then(db => db.objects("Projects"));
    }
}
action.js（动作创建者） 
import Service from "./service";

export {
    getAllProjects() {
        return async dispatch => {
            const allProjects = await Service.getProjects();
            dispatch({
                type: ....,
                payload: allProjects
            })
        }
    }
}
component.js（反应本机） 
class Component extends ... {

    componentDidMount() {
        this.props.getAllProjects();
    }

    render() {
        const { Projects } = this.props;

        if(Projects.loading) {
            return <LoadingCircle />; // This never gets displayed, even though the Projects.loading yields "true".
        }
        
        return JSON.stringify(this.props.Projects);
    }
}

我希望对这个基本问题的任何修复都可以解决我的问题，即在 Realm DB 完成之前，路由器无法动画/转换，加上用户输入正在排队。

我曾尝试使用 Axios 提出一个很长的请求，看看它是否会产生同样的问题。但是，它似乎只发生在 Realm DB 上，因为 Axios 似乎没有阻止 UI。

4

1 回答 1

0

我认为你的问题是你如何打开它。Realm.open 不是一个承诺，它返回一个进度承诺。

https://realm.io/docs/javascript/latest/api/Realm.html#.open

例如，您的代码可以更改为...

Realm.open(config)
  .progress(() => {/** progress callback here **/} )
  .then(realm => { 
    realm.objects('Projects')
  })

或者像其他部分一样重写为 async/await

let progress = Realm.open(config)
let realm = await progress
return realm.objects('Projects')

或者，如果您想传递进度处理程序，您也可以这样做

let realm = await Realm.open(config).progress(() => {/** progress callback here **/})
return realm.objects('Projects')
于 2018-07-04T21:46:19.630 回答