[英]How to store data locally in React Native that is not a string
我正在尋找一種在 React Native 中本地存儲對象和數據數組的方法。 如何才能做到這一點? 查看 AsyncStorage 的 api:
static setItem (key: string, value: string, callback?: ?(error: ?Error) => void)
設置 key 的值並在完成時調用回調,如果有錯誤,則會出現錯誤。 返回一個 Promise 對象。
如何在 React Native 中本地存儲對象和數組?
JSON.stringify({}) 可用於將您的數據結構轉換為字符串。
然后,您將使用 JSON.parse() 將字符串轉換回原始數據結構。
您可以為此創建一個很好的服務,以消除整個應用程序中的一些樣板代碼。 在下面的示例中,我使用 React Native 的內置 AsyncStorage API 作為“持久”存儲設施。 按照您認為合適的方式進行調整。
使用 React Native 的示例
使用 JSON API 將對象存儲在持久存儲中,即 React Native 的 AyncStorage,然后檢索該值,並將其輸出到 Text 元素中。 未經測試。
Storage.js 文件 - 請注意,此示例對象 API 提供了一個圍繞 ReactNative 的 AsyncStorage API 提供的內容的子集包裝器,您可以對其進行調整以允許設置多個鍵,例如,而不是一次設置一個。
//./storage.js
const Storage = {
getItem: async function (key) {
let item = await AsyncStorage.getItem(key);
//You'd want to error check for failed JSON parsing...
return JSON.parse(item);
},
setItem: async function (key, value) {
return await AsyncStorage.setItem(key, JSON.stringify(value));
},
removeItem: async function (key) {
return await AsyncStorage.removeItem(key);
}
};
反應原生組件
//Usage...
import React, {Component} from "react";
import { View, Text } from "react-native";
import Storage from "./storage";
class Foo extends Component {
constructor (props) {
super(props);
this.state = {
greeting: ""
};
}
async componentDidMount () {
await Storage.setItem("someObj", {value: "bar", id: 1});
let obj = await Storage.getItem("someObj");
this.setState({
greeting: obj.value // Will be "bar"
});
}
render () {
return (
<View>
<Text>{this.state.greeting}</Text>
</View>
);
}
}
原始示例:
正如我最初在移動設備上回答的那樣,我最初確實使用 HTML5 localStorage api 作為示例,它的輸入速度更快(而且很冷!),這里只是以防萬一有人在此進行反應,而不是反應-本地錯誤。
var StorageService = function () {};
StorageService.prototype.get = function (key) {
return JSON.parse(window.localStorage.getItem(key));
};
StorageService.prototype.set = function (key, value) {
return window.localStorage.setItem(key, JSON.stringify(value));
};
最近在寫pleex,你可以看看https://github.com/E-RROR/pleex 。 您可以將數據保存在純 json 中或使用類型檢查功能等創建模式。 謝謝
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.