Одноэлементный объект соединения в реакции родной

Я пытаюсь создать одноэлементный класс обслуживания, в котором я создаю экземпляр объекта подключения, который подключается к серверной части, чтобы повторно использовать объект подключения в каждом компоненте, поэтому я сделал это:

const {
Kuzzle,
WebSocket
 } = require('kuzzle-sdk');

class KuzzleService {

static instance = null;
static async createInstance() {
    var object = new KuzzleService();
    object.kuzzle = new Kuzzle(
        new WebSocket('localhost'),{defaultIndex: 'index'}
    );
    await object.kuzzle.connect();
    const credentials = { username: 'user', password: 'pass' };
    const jwt = await object.kuzzle.auth.login('local', credentials);
    return object;
}

static async getInstance () {
    if (!KuzzleService.instance) {
        KuzzleService.instance = await KuzzleService.createInstance();
    }
    return KuzzleService.instance;
}

}
const kuzzleService = KuzzleService.getInstance();
export default kuzzleService;

Но когда я импортирую службу в компонент следующим образом:

import kuzzleService from "../services/kuzzle-service.js";

И я печатаю это:

 async componentDidMount(){
    console.info(JSON.stringify(kuzzleService.kuzzle));
 }

Это дает мне «неопределенное». Должен ли я импортировать службу другим способом?

Умерло ли Create-React-App?
Умерло ли Create-React-App?
В этом документальном фильме React.dev мы исследуем, мертв ли Create React App (CRA) и какое будущее ждет этот популярный фреймворк React.
Освоение React Native: Пошаговое руководство для начинающих
Освоение React Native: Пошаговое руководство для начинающих
React Native - это популярный фреймворк с открытым исходным кодом, используемый для разработки мобильных приложений. Он был разработан компанией...
В чем разница между react native и react ?
В чем разница между react native и react ?
React и React Native - два популярных фреймворка для создания пользовательских интерфейсов, но они предназначены для разных платформ. React - это...
От React к React Native: Руководство для начинающих по разработке мобильных приложений с использованием React
От React к React Native: Руководство для начинающих по разработке мобильных приложений с использованием React
Если вы уже умеете работать с React, создание мобильных приложений для iOS и Android - это новое приключение, в котором вы сможете применить свои...
Хуки React: что это такое и как их использовать
Хуки React: что это такое и как их использовать
Хуки React - это мощная функция библиотеки React, которая позволяет разработчикам использовать состояние и другие возможности React без написания...
1
0
278
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Вероятно, это связано с тем, что при экспорте kuzzleService обещание, данное .getInstance(), еще не выполнено.

Вы должны экспортировать функцию .getInstance и ожидать ее в componentDidMount, например:

export default KuzzleService; // export the singleton directly
async componentDidMount(){
    const kuzzle = await KuzzleService.getInstance();
    console.info(kuzzle);
}

Спасибо команде Kuzzle ;)

Hubert Solecki 11.04.2019 16:45

Другие вопросы по теме