【问题标题】:Is it efficient to dispatch data from just firebase listeners?仅从 firebase 侦听器发送数据是否有效?
【发布时间】:2019-03-22 12:30:16
【问题描述】:
const listRef = firebase.database().ref();

const reducer = (state = {}, action) => {
  switch (action.type) {
    case: "GET_LIST" : {
      const { list } = action;

      return { list };
    };
    case: "ADD_ELEMENT" : {
      const { elementId } = action;

      return { ...state, [elementId]: true };
    };
    default : return state;
  };
};

const getList = list => ({
  type: "GET_LIST", list
});

const addElement = elementId => ({
  type: "ADD_ELEMENT", elementId
})

const getListFromDb = () =>
  async dispatch => listRef.once("value", snap => {
    dispatch(
      getList(
        list
      )
    );
  });

const listenToElementAdded = () =>
  async dispatch => listRef.on("child_added", ({ key: elementId }) => {
    dispatch(
      addElement(
        element
      )
    );
  });

const addElementToDb = () =>
  async dispatch => dispatch(
    addElement(
      listRef.push().key
    )
  );

const Component = ({
  list,

  getListFromDb,
  listenToElementAdded,
  addElementToDb
}) => {
  useEffect(() => getListFromDb(), []);
  useEffect(() => listenToElementsAdded());

  return (
    <div>
      { Object.keys(list).map(id => <p>{id}</p>) }
      <p onClick={addElementToDb}>Add</p>
    </div>
  );
};

const mapStateToProps = list => ({ list });

const mapStateToProps = {
  getListFromDb,
  listenToElementAdded,
  addElementToDb
};

export default connect(mapStateToProps, mapStateToProps)(Component);

上面的简化示例说明了我的意思。问题是:firebase 侦听器是否足够快,可以用 redux 替换数据预调度?

如果我们想要构建一个应用程序,我们想要实时刷新来自外部的数据,监听器可以提供帮助。但是如果我们预先发送我们得到的数据,我们就会发送两次。此外,如果我们只使用侦听器并从那里分派,它可以使代码及其工作更加清洁。但是,如果我们在数据库中有大量数据怎么办?听众会很快吗?仅通过侦听器处理调度是否有效,还是值得预先调度到位?

【问题讨论】:

    标签: javascript reactjs firebase firebase-realtime-database redux


    【解决方案1】:

    我建议让您的 firebase 事件侦听器调用 redux-thunk 操作,然后操作数据并将其分派到您的应用程序。如果处理得当,这没有什么问题。

    但是考虑一些不是更好但不同的方法。

    react-redux-firebase 允许与您的应用程序商店紧密耦合。但是,如果这过于集成(您实际上是在将您的应用与 firebase 融合在一起),那么请使用前者。

    无论如何,我建议您搜索更多有关在您的 redux 应用中使用 firebase 的内容。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2016-09-15
      • 2020-05-14
      • 2012-04-01
      • 1970-01-01
      • 1970-01-01
      • 2021-09-11
      • 2012-06-24
      • 1970-01-01
      相关资源
      最近更新 更多