Back to Details

react-native-storage-manager

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese

React Native Storage Manager

React Native 存储管理器

This skill provides established patterns for data persistence using MMKV and Expo SecureStore in the Fitness Tracker App.
该技能为健身追踪App中使用MMKV和Expo SecureStore实现数据持久化提供了成熟的模式。

When to Use This Skill

何时使用该技能

Use this skill when you need to:
  • Persist data locally on the device
  • Implement encrypted storage for sensitive data
  • Handle user preferences or application state persistence
  • Manage MMKV storage instances and keys
  • Perform common CRUD operations on local storage
当你需要以下功能时可以使用该技能：
  • 在设备本地持久化数据
  • 为敏感数据实现加密存储
  • 处理用户偏好设置或应用状态持久化
  • 管理MMKV存储实例与密钥
  • 对本地存储执行常见的CRUD操作

Storage Initialization

存储初始化

The app uses an encrypted MMKV instance initialized in 
app/utils/storage/index.ts
.
应用使用在
app/utils/storage/index.ts
中初始化的加密MMKV实例。

Secure Encryption Key

安全加密密钥

We use Expo SecureStore to persist the encryption key securely.
typescript
import * as SecureStore from "expo-secure-store"
import { MMKV } from "react-native-mmkv"

export const storage = new MMKV({
  id: "purrsuit-storage",
  encryptionKey: SecureStore.getItem("mmkv-encryption-key"),
})
我们使用Expo SecureStore来安全持久化加密密钥。
typescript
import * as SecureStore from "expo-secure-store"
import { MMKV } from "react-native-mmkv"

export const storage = new MMKV({
  id: "purrsuit-storage",
  encryptionKey: SecureStore.getItem("mmkv-encryption-key"),
})

Basic CRUD Operations

基础CRUD操作

Use the provided helper functions from 
@/utils/storage
.
使用
@/utils/storage
中提供的辅助函数。

Saving Data

保存数据

typescript
import { save, saveString } from "@/utils/storage"

save("user_preferences", { theme: "dark", notifications: true })
saveString("auth_token", "secure-token-here")
typescript
import { save, saveString } from "@/utils/storage"

save("user_preferences", { theme: "dark", notifications: true })
saveString("auth_token", "secure-token-here")

Loading Data

加载数据

typescript
import { load, loadString } from "@/utils/storage"

const prefs = load<{ theme: string }>("user_preferences")
const token = loadString("auth_token")
typescript
import { load, loadString } from "@/utils/storage"

const prefs = load<{ theme: string }>("user_preferences")
const token = loadString("auth_token")

Removing Data

删除数据

typescript
import { remove, clear } from "@/utils/storage"

remove("auth_token")
clear() // Clear all data
typescript
import { remove, clear } from "@/utils/storage"

remove("auth_token")
clear() // Clear all data

Advanced Patterns

进阶模式

Typed Storage Keys

类型化存储密钥

Centralize storage keys to avoid typos and ensure consistency.
typescript
// app/utils/storage/keys.ts
export const STORAGE_KEYS = {
  USER_PREFS: "user_preferences",
  AUTH_TOKEN: "auth_token",
  ENCOUNTERS_CACHE: "workouts_cache",
} as const
集中管理存储密钥以避免拼写错误并确保一致性。
typescript
// app/utils/storage/keys.ts
export const STORAGE_KEYS = {
  USER_PREFS: "user_preferences",
  AUTH_TOKEN: "auth_token",
  ENCOUNTERS_CACHE: "workouts_cache",
} as const

Integration with MST

与MST集成

Stores can automatically persist their state using 
onSnapshot
or by loading data during 
afterCreate
.
Store可以通过
onSnapshot
或在
afterCreate
阶段加载数据来自动持久化其状态。

References

参考资料

See STORAGE_PATTERNS.md for detailed implementation examples.
See SECURITY_AND_ENCRYPTION.md for encryption best practices.
详细实现示例请参见STORAGE_PATTERNS.md。
加密最佳实践请参见SECURITY_AND_ENCRYPTION.md。