Вызвать состояние другого скрипта - PullRequest
Новая
       35

Вызвать состояние другого скрипта

0 голосов
/ 23 декабря 2019

Привет, ребята. У меня есть сценарий App.js , который работает во всем приложении и на моей странице реагирует навигация (ящик) Screen3.js

Я хочу назвать свое состояние скорость . из App.js в Screen3. моя скорость меняется каждые 10 секунд .

App.js 

import Screen1 from './pages/Screen1';
import Screen2 from './pages/Screen2';
import Screen3 from './pages/Screen3';
import CustomSidebarMenu from './CustomSidebarMenu';

global.currentScreenIndex = 0;

class NavigationDrawerStructure extends Component {

    toggleDrawer = () => {
        //Props to open/close the drawer
        this.props.navigationProps.toggleDrawer();
    };

    constructor(props) {

        super(props)

        this.state = {

            speed: ''
        }

          and rest script

Screen3.js 

import React, { Component } from 'react';
import { SectionList, FlatList, View, Text, TextInput, Button, StyleSheet, Image, PermissionsAndroid, ActivityIndicator, Platform, TouchableOpacity, List, Drawer, Container, Header, Content } from 'react-native';
import Geolocation from '@react-native-community/geolocation';
import { App } from '../App'

export default class Screen3 extends Component {

    render() {
        return (

            <View style={styles.MainContainer}>

              <Text style={{ fontSize: 23 }}> My Screen {global.currentScreenIndex + 1} </Text>
                <Text style={{ justifyContent: 'center', alignItems: 'center', marginTop: 16 }}>
                    myspeed: {App.this.props.speed} //< --- MY PROBLEM HERE <---!!
                </Text>

            </View>

        );
    }
}

const styles = StyleSheet.create({
    MainContainer: {
        flex: 1,
        paddingTop: 20,
        alignItems: 'center',
        marginTop: 50,
        justifyContent: 'center',
    },
});
```

Ответы [ 2 ]

3 голосов
/ 23 декабря 2019

Существует множество доступных опций, если вы хотите сохранить некоторые глобальные значения.

  1. Redux

    Сохраните этот параметр в хранилище приращений иподключите ваш компонент там, где вам нужно.

  2. Прослушиватель событий

    Вы можете использовать NativeEventEmitter и передавать значение вместе с этим вызовом. Теперь добавьте этот прослушиватель событий в компонент, где вам нужно обновленное значение, и все.

  3. Глобальное состояние

    Сохранение значения в состоянии уровня приложения ипередать его вместе со всеми дочерними элементами, но я не буду предпочитать эту опцию, так как этот параметр будет передаваться другим компонентам также там, где это на самом деле не требуется.

0 голосов
/ 23 декабря 2019

Пройдите подобное состояние из App.js компонента 

<App speed={this.state.speed}/>

и получите доступ к этому как в вашем Screen3 компоненте 

<Text style={{ justifyContent: 'center', alignItems: 'center', marginTop: 16 }}>
         myspeed: {this.props.speed} 
 </Text>

Примечание. Поскольку вы осуществляете доступ, это не способ доступа к состоянию от родительского к дочернему компоненту.

Если вы не хотите передавать состояние (скорость), как это, используйте контекстApi для этого, чтобы вы могли получить доступ куда угодно.

...