React Native + MongoDB Stitch: this.client.getServiceClient не является функцией - PullRequest
0 голосов
/ 12 апреля 2020

Я пытаюсь создать простое соединение с моей коллекцией базы данных MongoDB для моего приложения Stitch. В методе componentDidMount() я инициализирую клиент приложения по умолчанию и сохраняю его в переменной компонента. Но когда я пытаюсь установить пульт MongoDB после, он не работает, я получаю

TypeError: this.client.getServiceClient is not a function. (In 'this.client.getServiceClient(MongoDB.RemoteMongoClient.factory, "mongodb-atlas")', 'this.client.getServiceClient' is undefined)

screenshot of Expo error screen

Я прочитал все документы React Native, такие как this или this , и вижу, что структура не совпадает, но я не хочу, чтобы пользователь входил в систему в приложении (почему я использовал AnonymousCredential()), и даже если бы я использовал эту структуру, я бы не знал, что делать после входа в систему, как получить данные? Поскольку не определен удаленный клиент, следовательно, нет базы данных и коллекции.

Вот мой компонент:

import React from "react";
import { StyleSheet, View, TextInput, Button, FlatList } from "react-native";
import PlayerItem from "./PlayerItem";
import { Stitch, AnonymousCredential } from "mongodb-stitch-react-native-sdk";
const MongoDB = require("mongodb-stitch-react-native-services-mongodb-remote");

export default class Search extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            players: [],
        };
        this.query = "";
    }

    componentDidMount() {
        this.client = Stitch.initializeDefaultAppClient("kungfuzone-rzksu");
        const mongodb = this.client.getServiceClient(
            MongoDB.RemoteMongoClient.factory,
            "mongodb-atlas"
        );

        this.db = mongodb.db("players");
        this._displayPlayersOnLoad();
    }

    _displayPlayersOnLoad() {
        this.client.auth
            .loginWithCredential(new AnonymousCredential())
            .then(this._displayPlayers)
            .catch(console.error);
    }

    _displayPlayers() {
        this.db
            .collection("kungfuzone")
            .find({}, { limit: 1000 })
            .asArray()
            .then((players) => {
                this.setState({ players: players });
            });
    }

    _updateQuery(text) {
        this.query = text;
    }

    _searchPlayers(query) {
        if (query.length > 0) {
            this.stitchClient.auth
                .loginWithCredential(new AnonymousCredential())
                .then(() => this.setState({ players: db.find({ name: query }).asArray() }))
                .catch(console.error);
        }
    }

    render() {
        return (
            <View style={styles.container}>
                <TextInput
                    style={styles.textinput}
                    onChangeText={(input) => this._updateQuery(input)}
                    placeholder="Player's name"
                />
                <Button title="Search" onPress={() => this._searchPlayers(this.query)} />
                <FlatList
                    data={this.state.players}
                    keyExtractor={(item) => item.id.toString()}
                    renderItem={({ item }) => <PlayerItem player={item} />}
                />
            </View>
        );
    }
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        marginTop: 20,
    },
    textinput: {
        marginLeft: 5,
        marginRight: 5,
        height: 50,
        borderColor: "#000000",
        borderWidth: 1,
        paddingLeft: 5,
    },
});

Кто-нибудь может помочь? Спасибо :) 1024 *

1 Ответ

0 голосов
/ 13 апреля 2020

На самом деле не рекомендуется устанавливать соединение напрямую с удаленной базой данных из мобильного приложения. Как насчет использования atlas API или создания API для связи с MongoDB?

...