Как использовать экземпляр библиотеки в приложенииact-redux во всех контейнерах / компонентах - PullRequest
Новая
       53

Как использовать экземпляр библиотеки в приложенииact-redux во всех контейнерах / компонентах

0 голосов
/ 08 ноября 2019

Я работаю над собственным приложением на основе WebRTC. Я уже собрал полное приложение с простым Javascript для браузеров, где я создаю два разных типа библиотек.

  1. webrtc.js (здесь я написал полный код, необходимый для поддержки сеанса webrtc)
  2. ui.js (здесь я написал полный код, необходимый для поддержки пользовательского интерфейса в соответствии с пользователемдействия)

Структура каталогов приложения на основе браузера

Browser App Directory Structure

Теперь я пытаюсь создать приложение на реагирующем языкес приставкой, но у меня возникают проблемы с использованием моего webrtc.js экземпляра библиотеки в приложении.

Простой подход, которому я следую для приложения на основе браузера:

  1. Создание глобального экземпляра webrtc.js и его полное использование ui.js

В приложении на основе реагирования : --

Собственная структура приложения: -

Native App Dir Structure

//  LoginScreen.js
import React, { Component } from 'react';
import {
  View,
  Text
} from 'react-native';
import { connect } from 'react-redux'
import t from 'tcomb-form-native';
import io from 'socket.io-client'
import config from '../libs/config'
import WebRTC from '../libs/webrtc'
import { thunk_action_creator } from '../actions'

class LoginScreen extends Component {
    constructor(props){
      super(props);
      this.formRef = React.createRef();
      let server_endpoint = 'https://10.0.19.17:3000';    
      const socket = io.connect(server_endpoint, {
        transports: ['websocket']
      });
      this.webrtc = new WebRTC(socket,config); //--- Now, I have to pass this object in my complete application 
    }
    submitForm = () => {
        let value = this.formRef.getValue();
        if(value){
            this.props.dispatch(thunk_action_creator(value))
        }

    }
    render() {
      ...
    }
}

Теперь я должен передать this.webrtc объект во всем приложении иливо всех других контейнерах / компонентах для доступа к тому же экземпляру. Как мне этого добиться? Должен ли я использовать состояние или реквизит? Но этот экземпляр webrtc содержит много информации о сеансе webrtc, поэтому он не нарушит работу приложения? Или если это будет правильный подход, то и как мне этого добиться?

...