简体   繁体   English

React Native Firebase仅获取一个数据

[英]React Native Firebase Fetching Only One Data

How can I fetch only one data and write it to Header ? 如何仅获取一个数据并将其写入Header?
I am using firebase and react-redux. 我正在使用Firebase和react-redux。

firebase structure i try to write " organization ": inovanka: 我尝试写的firebase结构“ organization ”:inovanka: 我尝试写“ ** organization **”的firebase结构:inovanka

Action File Codes: 动作文件代码:

import firebase from 'firebase';
import { Actions } from 'react-native-router-flux';
import { ORGANIZATION_NAME_DATA_SUCCESS } from './types';


 export const organizationName = () => {
    const { currentUser } = firebase.auth();
      return (dispatch) => {
        firebase.database().ref(`/organizations/${currentUser.uid}`)
          .on('value', snapshot => {
            dispatch({ type: ORGANIZATION_NAME_DATA_SUCCESS, payload: snapshot.val() });
        });
    };
  }

Reducer File : 减速器文件:

import { ORGANIZATION_NAME_DATA_SUCCESS } from '../actions/types';

const INITIAL_STATE = {

};

export default (state = INITIAL_STATE, action) => {
  switch (action.type) {
    case ORGANIZATION_NAME_DATA_SUCCESS:
      console.log(action); // data retrieved as array
      return action.payload
    default:
      return state;
  }
};

Component: (I would like to write it to this) 组件:(我想写成这个)

    class HomePage extends Component {

      componentWillMount() { 
      }

      render() {
        return (
          <Container>
            <Header> 
              <Text> i would like to write it here </Text>
            </Header>
            <Content>

            </Content>
          </Container>
        );
      }
    }

    const mapStateToProps = ({ homepageResponse }) => {
      const organizationArray = _.map(homepageResponse, (val, uid) => {
        return { ...val, uid }; //
      });
      return { organizationArray };
    };

    export default connect(mapStateToProps, { organizationName })(HomePage);

Change this: 更改此:

firebase.database().ref(`/organizations/${currentUser.uid}`)
      .on('value', snapshot => {

to this: 对此:

firebase.database().ref(`/organizations/${currentUser.uid}`)
      .once('value', snapshot => {

using once() will read data only one time, thus fetching only one data 使用once()将仅读取一次数据,因此仅获取一个数据

Solution is Here ! 解决方案在这里!

Action File: 动作文件:

export const organizationName = () => {
    const { currentUser } = firebase.auth();
      return (dispatch) => {
        firebase.database().ref(`/organizations/${currentUser.uid}`)
        .once('value', snapshot => {
          _.mapValues(snapshot.val(), o => {
            console.log(o);
          dispatch({ type: ORGANIZATION_NAME_DATA_SUCCESS, payload: {organization: o.organization, fullname: o.fullname }});
          });
        });
    };
  }

Reducer File 减速器文件

const INITIAL_STATE = {
  organization: '',
};

export default (state = INITIAL_STATE, action) => {
  switch (action.type) {
    case ORGANIZATION_NAME_DATA_SUCCESS:
      console.log(action);
      return {...state, organization:action.payload.organization };
    default:
      return state;
  }
};

Component File MapToStateProps and componentWillMount 组件文件MapToStateProps和componentWillMount

 const mapStateToProps = state =>  {
    const { organization, fullname  } = state.homepageResponse;
    console.log("burada" + organization);
       return { organization, fullname };
};




 componentWillMount(){
    this.props.organizationName();
  }

*Last Step Header * *最后一步标题*

render() {
    return (
      <Container>
        <Header>
          <Text>  { this.props.organization } </Text>
        </Header>
      </Container>
}

Thank You Everyone 谢谢大家

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 在 React Native 中从 Firebase 获取数据 - Fetching data from Firebase in React Native 应用程序从 firebase 缓慢获取大量数据反应原生 - App Fetching slowly large number of data from firebase react native React Native Firebase Firestore 数据获取与空格 - React Native Firebase Firestore data fetching with empty spaces 在另一个屏幕上从该数据库中获取数据之前,我如何才能等到数据在一个屏幕中添加到数据库中? (反应原生,Firebase) - How can I wait until data is added to a database in one screen before fetching the data from that database on another screen? (React Native, Firebase) 在 React 中将 Firebase 数据提取到数据表中 - Fetching Firebase Data Into A Datatable In React 从 firebase 实时数据库中获取数据时如何通过 function 返回数据 - how to return data through function when fetching data from firebase realtime-database in react native React Native 获取 Firebase 数据只返回“object Object”? - React Native getting Firebase data only return "object Object"? 如何在 React Native 中将 Firebase 实时数据库数据值加一? - How to increment Firebase Realtime database data values by one in React Native? 在React Native中使用标头从API提取数据 - Fetching Data from an API with Headers in React Native 在 React Native 中从 JSON 获取数据 - Fetching data from JSON in React Native
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM