0

我尝试使用 populate 将我的数据中的 ID 替换为 Firebase 中的其他数据,但它不起作用。

我使用“firebase”:“^7.3.0”、“react-redux-firebase”:“^3.0.5”、“redux”:“^4.0.4”、“react-redux”:“^7.1.3 ", "redux-thunk": "^2.3.0".

我的firebase db 点击显示

应用程序.js

import React, { Component } from 'react';
import AppContainer from './config/routes';
import { Provider } from 'react-redux';
import { createStore, applyMiddleware } from 'redux';
import rootReducer from './store/reducers/rootReducer';
import thunk from 'redux-thunk';
import { ReactReduxFirebaseProvider, getFirebase } from 'react-redux-firebase';
import { firebase} from './config/firebase';

const store = createStore(
  rootReducer,
  applyMiddleware(thunk.withExtraArgument(getFirebase)),
);

const rrfConfig = {
 userProfile: 'users',
 profileParamsToPopulate: [
   { child: 'nutrient', root: 'nutrients_list' } 
 ]
}

const reactReduxFirebaseProps = {
  firebase,
  config: rrfConfig ,
  dispatch: store.dispatch,
};

export default class App extends Component {
  render() {
    return (
      <Provider store={store}>
        <ReactReduxFirebaseProvider {...reactReduxFirebaseProps}>
          <AppContainer />
        </ReactReduxFirebaseProvider>
      </Provider>
    );
  }
}

配置.js

import firebase from 'firebase/app';
import 'firebase/database'

const config = {
  apiKey: 'my apiKey'
  authDomain: 'my authDomain',
  databaseURL: 'my databaseURL',
  projectId: 'my projectId',
  storageBucket: 'my storageBucket',
  messagingSenderId: 'my messagingSenderId',
  appId: 'my appId',
  measurementId: 'my measurementId',
};

if (!firebase.apps.length) {
  firebase.initializeApp(config);
}

export { firebase }

Food.js(在这个组件中我使用填充)

import React, { Component } from 'react';
import { View, Text, StyleSheet, ScrollView } from 'react-native';
import Icon from 'react-native-vector-icons/FontAwesome';
import { compose } from 'redux';
import { connect } from 'react-redux';
import { firebaseConnect, populate, isLoaded, isEmpty } from 'react-redux-firebase';

class Food extends Component {
render() {
    const { mealsArray } = this.props;

    if (!isLoaded(mealsArray)) {
      return <ActivityIndicator size="large" />
    }

    if (isEmpty(mealsArray)) {
      return <Text>There is no meals </Text>
    }

    return (
      <View>
        <ScrollView>
          <Text>{JSON.stringify(mealsArray, null, 2)}</Text>
        </ScrollView>
      </View>
    );
  }

const populates = [
  { child: 'nutrient', root: 'nutrients_list' }
]

const mapStateToProps = state => {
    return {
    mealsArray: populate(state.firebase, 'meals', populates)
  };
};

export default compose(
  firebaseConnect([
    { path: 'meals', queryParams: ['orderByChild=date', 'equalTo=18/11/2019'], populates},
  ]),
  connect(
    mapStateToProps,
  ),
)(Food);

我希望关键的“营养素”将返回对象而不是 ID 号:

{
  nutrient: {
    name: 'buckwheat',
    proteins: 12.6,
    fats: 2.6,
    carbs: 68,
    calories: 329,
    water: 10,
  },
  number: 1,
  weight: 100,
}
4

1 回答 1

0

您似乎正在尝试在列表(膳食)中的每个项目中填充项目(营养)列表,该列表有两个层次。中目前不支持多层次的深度人口populate,您最好为每餐提供单独的组件。然后在每个膳食成分中,您可以循环遍历营养素并在每个单一营养素上运行填充。

相反,最好只为每种营养素存储一个唯一的密钥,然后将有关膳食中营养素的元信息存储在另一个密钥下,也许nutrients_amounts或者nutrients_meta

它还将使用由push项目键生成的唯一键而不是数组索引。这使得在数据库的另一部分中引用值变得更加容易,并且有助于避免出现稀疏数组的情况。

于 2019-11-23T16:04:11.123 回答