【问题标题】:Is there a place for a database in a Redux / React Application?Redux / React 应用程序中是否有数据库的位置?
【发布时间】:2017-03-14 13:23:57
【问题描述】:

在构建 redux / react 应用程序时,您是否仍然需要使用数据库来存储数据,还是一切都进入 redux 存储就可以了?

如果需要数据库,在哪里进行数据库调用的最佳位置?

【问题讨论】:

  • Redux 只管理前端应用程序的状态。它不会持久化数据。
  • Redux 只保存前端应用程序的状态,这意味着它在页面刷新后就消失了,要持久化它,您仍然需要将该状态保存在数据库中,很可能使用标准方法,例如调用到 REST API
  • 非常感谢。我是初学者,我没有得到这个。
  • 嗨,joe,如果使用 redux persist,那还需要使用后端数据库吗?

标签: reactjs redux


【解决方案1】:

是的,通常需要对状态数据进行序列化和反序列化。这有很多用途,不仅可以保持会话或页面刷新之间的状态,还可以提供帮助您的应用程序使用数据的查询工具。

如果您的应用程序已连接,那么它很可能可以访问远程端点,这些端点将为您处理数据存储。在这种情况下,服务器端数据库,如 mongodb、rethinkdb 或 sqlserver 是通常的前进方式

如果您谈论的是断开连接、仅限浏览器的应用程序,那么您始终可以将您的状态序列化为 localStorage。我经常这样做,我通常会编写一个简单的外观,允许我“查询”本地数据。如果您需要更强大的本地数据库,那么可以使用 localStorageDB 等软件包来提供帮助。

这里有一些代码显示了这很容易:

db.js

这是位于我使用的名为 store 的 localstorage 包前面的外观

import store from 'store'

const clear = (key) => {
  if (key) {
    return store.remove(key)
  }
  store.clear()
}

const get = (key, defaultValue) => {
  return store.get(key) || defaultValue
}

const set = (key, value) => {
  store.set(key, value)
}

export { clear, get, set }

transactions.js

这是db 的示例用法。在这里,我得到并设置和清除 transactions 的集合

import * as db from './db'

const clear = () => {
  db.clear('transactions')
}

const transactions = value => {
  if (value) {
    db.set('transactions', value)
  } else {
    return db.get('transactions', [])
  }
}

export { clear, transactions }

【讨论】:

  • 有点跑题了,但是如果您要将应用程序的数据持久化到浏览器(大概是为了永久保留在那里),localStorage 不是最佳选择。每个域最多只能获得 5MB 的存储空间,而且用户很容易意外擦除他们的数据。长期数据存储更适合IndexedDB。您可以通过使用localForage 获得两全其美,它提供了一个带有 IndexedDB 后端的类似 localStorage 的 API。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2019-03-22
  • 2017-01-16
  • 2019-01-15
  • 1970-01-01
  • 2019-02-07
  • 2019-12-19
  • 2016-11-09
相关资源
最近更新 更多