Question

我正在重构应用程序，但我不知道如何通过使用ducks / reduxsauce的应用程序从Firebase获取数据值。

我有带ActionCreators的文件/store/ducks/restaurants.js-具有单独导出任务的函数。这些函数获取Firebase数据库结果的列表。但是我不知道如何访问它并获得结果。

/store/ducks/restaurant.js文件：

//import { getFirebase } from "react-redux-firebase";
//import { getFirestore } from "redux-firestore";
import { createActions, createReducer } from "reduxsauce";

export const { Types, Creators } = createActions({
  setRestaurant: ["restaurantInfo"],
  setRestaurantList: ["restaurantList"],
  clearRestaurant: null
});

const INITIAL_STATE = {
  loading: false,
  data: {},
  list: {}
};

const setRestaurant = (state = INITIAL_STATE, action) => {
  return {
    ...state,
    loading: false,
    data: action.restaurantInfo
  };
};
const setRestaurantList = (state = INITIAL_STATE, action) => {
  return {
    ...state,
    loading: false,
    list: action.restaurantList
  };
};
const clearRestaurant = (state = INITIAL_STATE, action) => {
  return {
    ...INITIAL_STATE
  };
};

export const syncRestaurantList = ({ city = null, uf = null } = {}) => {
  return (dispatch, getState, { getFirebase, getFirestore }) => {
    const firestore = getFirestore();
    const firebase = getFirebase();

    let restaurantsRef = firestore.collection("restaurants");
    if (uf) {
      restaurantsRef = restaurantsRef.where("uf", "==", uf);
    }
    if (cidade) {
      restaurantsRef = restaurantsRef.where("city", "==", city);
    }

    restaurantsRef.onSnapshot(snap => {
      let list = {};
      snap.forEach(doc => {
        const data = doc.data();
        const id = doc.id;
        list[id] = data;
      });
      dispatch(Creators.setRestaurantList(list));
    });
  };
};


export default createReducer(INITIAL_STATE, {
  [Types.SET_RESTAURANT]: setRestaurant,
  [Types.CLEAR_RESTAURANT]: clearRestaurant,
  [Types.SET_RESTAURANT_LIST]: setRestaurantList
});

我如何从页面访问syncRestaurantList结果？

如何使用钩子从firebase中获得带有鸭子的列表项？

0 个答案: