Переменная Atob при рендеринге экрана

Question

Я получаю ошибку [Unhandled promise rejection: ReferenceError: Can't find variable: atob]. И мой экранный код:

import React, { Component } from "react";
import { View, StatusBar, Text } from "react-native";
import firebase from "firebase";
import "firebase/firestore";
import { RowItem } from "../components/RowItem";
import { Header, Left, Right, Icon } from "native-base";

const styles = {
  container: {
    flexDirection: "row",
    flexWrap: "wrap",
    padding: 20
  }
};

class QuizIndex extends Component {
  constructor(props) {
    super(props);
    this.state = {
      docs: []
    };
  }

  async componentDidMount() {
    await this.quizes();
  }

  quizes = async () => {
    let result = await firebase
      .firestore()
      .collection("quiz")
      .where("parentId", "==", "")
      .get()
      .then(r => {
        console.log("fine");
      })
      .catch(e => {
        console.log("Not fine");
      });

    const docs = result.docs.map(doc => {
      return { uid: doc.id, ...doc.data() };
    });

    return this.setState({ docs });
  };

  render() {
    return (
      <View style={styles.container}>
        <StatusBar barStyle="dark-content" />
        {this.state.docs.map(doc => (
          <RowItem
            key={doc.uid}
            parentId={doc.parentId}
            name={doc.title}
            color={doc.color}
            icon={doc.icon}
            onPress={() =>
              this.props.navigation.navigate("QuizSub", {
                title: doc.title,
                color: doc.color,
                parentId: doc.uid
              })
            }
          />
        ))}
      </View>
    );
  }
}

export default QuizIndex;

Я не понимаю, где эта проблема возникает, потому что все работало нормально. У вас есть предложения по этому поводу? Я погуглил, но ни одно из решений не помогло мне.

Answer 1

Это проблема в зависимости от Firebase

Попробуйте использовать версию 7.9.0, эта версия будет работать нормально.

yarn add firebase@7.9.0

Answer 2

Я думаю, что если вы установите пакет base-64 npm, он решит проблему, но не совсем понимаю, почему это происходит.

yarn add base-64
#or
npm install base-64

В приложении. js добавьте:

import {decode, encode} from 'base-64'

if (!global.btoa) {  global.btoa = encode }

if (!global.atob) { global.atob = decode }