首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >React Native Mobx空指针取消引用

React Native Mobx空指针取消引用
EN

Stack Overflow用户
提问于 2019-03-22 06:02:53
回答 1查看 413关注 0票数 2

我使用mobx (和mobx-persist)作为我的react原生应用全局商店(我使用expo客户端)。首先,我从服务器获取一些数据,然后将结果保存在存储中,并将它们持久化到asyncStorage中。它一开始工作得很好,但是当我尝试登录时,应用程序突然冻结,然后崩溃,摘要中包含“原因:空指针取消引用”。以下是我的代码。

商店代码:

代码语言:javascript
复制
import { observable, computed, action, set } from 'mobx';
import { create, persist } from 'mobx-persist';
import { AsyncStorage } from 'react-native';

class Store {
    URL = 'XX.XX.XX.XX'
    @persist('object') @observable db = {
        authToken: '',
        buses: null,
        term: null,
    }

    @computed get buses () {
        return this.db.buses
    }

    @computed get term () {
        return this.db.term
    }

    @computed get authToken () {
        return this.db.authToken
    }

    @action setAuthToken = (token) => {
        this.db.authToken = token;
    }

    @action setBuses = (buses) => {
        this.db.buses = buses;
    }

    @action setTerm = (term) => {
        this.db.term = term;
    }
}

const hydrate = create({
    storage: AsyncStorage,
    jsonify: true
})

store = new Store()

storeLoader = async () => {
    await hydrate('object', store)
    return store
}
hydrate('object', store)
module.exports = { store, storeLoader }

登录屏幕代码:

代码语言:javascript
复制
import { store } from './store'
import { observer } from 'mobx-react';


 fetch(`http://${store.URL}/login`, {
    method: 'POST',
    headers: {
        'Content-Type': 'application/json',
    },
    body: JSON.stringify({
        email: this.state.email,
        password: this.state.password
    })
}).then(res => res.json()).then(res => {
    if (res.token) {
        store.setAuthToken(res.token)
        store.setTerm(res.term)
        store.setBuses(res.buses.sort((a, b) => {
            let first = a.fields[0].time, second = b.fields[0].time;
            let firstArr = first.split(":", 2), secondArr = second.split(":", 2);
            if (firstArr[0] !== secondArr[0])
                return firstArr[0] - secondArr[0];
            else
                return firstArr[1] - secondArr[1];
        }))
        this.props.navigation.navigate("App")
    }
    if (res.error) {
        this.setState({error: res.error})
    }
}).catch(err => console.log(err))

AuthToken和术语都在保存,但总线在记录时要么返回null,要么使应用程序崩溃。经过几个小时的调试和搜索,我发现有些人面临着类似的问题,因为他们试图保存嵌套对象的大型数组,所以我认为可能总线数组实际上有那么大(虽然不是),所以我尝试在总线中保存一个只有一个键值对的对象,但没有成功。

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2019-04-06 18:39:09

使用自定义类的持久化列表修复:

在类存储中:

代码语言:javascript
复制
@persist('list', Bus) @observable Buses = []

在类总线中:

代码语言:javascript
复制
class Bus {
    @persist @observable someField1 = ''
    @persist @observable someField2 = false
    @persist('list', field) @observable fields = []
}

甚至class Bus也使用了另一个class字段:

代码语言:javascript
复制
class field {
    @persist @observable someField1 = ''
    @persist @observable someField2 = ''
}
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/55289936

复制
相关文章

相似问题

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