Есть ли способ использовать объект с другой страницы? - PullRequest
Новая
       34

Есть ли способ использовать объект с другой страницы?

0 голосов
/ 11 февраля 2020

Я пытаюсь извлечь только имя пользователя из "userPrincipalName" и затем объединить его в вызов Ax ios в качестве параметра.

"userPrincipalName" объект остается внутри СТРАНИЦА БАНАНЫ , и я хочу использовать его снова на СТРАНИЦЕ ЯБЛОКА .

на СТРАНИЦЕ БАНАНОВ Я установил его внутри localStore и сделал рендеринг следующим образом: 

export default class Example extends Component {
  constructor(props) {
    super(props);
    this.state = {
      visibleModal: 3,
      azureLoginObject: {},
      loginSuccess: false,

    };
    this.azureInstance = new AzureInstance(credentials);
    this._onLoginSuccess = this._onLoginSuccess.bind(this);

    localStore.setItem('userPrincipalName', 'foo');

  }

  _onLoginSuccess() {
    this.azureInstance.getUserInfo().then(result => {
      this.setState({
        loginSuccess: true,
        azureLoginObject: result,
      });
      console.log(result);
    }).catch(err => {
      console.log(err);
    })
  }


  render() {
    if (!this.state.loginSuccess) {

      return (
        <AzureLoginView
          azureInstance={this.azureInstance}
          onSuccess={this._onLoginSuccess}
        />)
    }

    if (this.state.visibleModal === 3) {
      const { givenName } = this.state.azureLoginObject;
      const { userPrincipalName } = this.state.azureLoginObject;

      return (
        <View style={styles.container}>
        </View>
      );
    }
    return (
      <PlacesNavigator />
    );
  }
}

, и теперь я хочу использовать его на APPLE PAGE , но я не не понимаю, как это сделать

это мой пример: 

export default class MainScreen extends Component {
    constructor(props) {
        super(props);
        this.state = { data: [] };
    }


    getData = () => {
        const userPrincipalName = localStore.getItem('userPrincipalName');

        this.setState({ isLoading: true, data: [] })
        axios.get("https://harigotphat1.mekorot.co.il/ConfirmPackaotWS/OrderApprove/OrderApp_Get_Orders_To_Approve/"+userPrincipalName.split('@')[0])
            .then(res => {
                this.setState({
                    isLoading: false,
                    data: res.data
                });
                console.log(res.data);
            });
    }

    componentDidMount() {
        this.props.navigation.setParams({ getData: this.getData });
        this.getData()
    }

    renderItems = (item, index) => {
        const { merhavid, yaamID, ezorID, shemEzor } = item;
        return (
            <TouchableHighlight style={{
                backgroundColor: '#ffff78'
            }}>
                <TouchableOpacity
                    onPress={() => this.props.navigation.navigate("Info")}>
                    <Text style={styles.name}>
                        {ezorID + "" + "      |" + "               " + merhavid + " " + yaamID + " " + shemEzor}
                    </Text>
                </TouchableOpacity>
            </TouchableHighlight>
        );
    }


    render() {

        return (
            <>
                <View style={styles.container}>
                    <FlatList
                        data={this.state.data}
                        keyExtractor={(_, index) => String(index)}
                        renderItem={({ item, index }) => { return this.renderItems(item, index) }}

                    />
                </View>

                <View style={styles.bottomMainContainer}>
                    <View style={styles.bottomView} >
                        <Text style={styles.bottomTextStyle}>סה"כ: {this.state.data.length} רשומות</Text>
                    </View>
                </View>
            </>
        );
    }
}

Ответы [ 4 ]

0 голосов
/ 11 февраля 2020

вы можете использовать реквизит и состояние. Концепция объясняется приведенным ниже примером кода, который вы можете попробовать использовать ниже

Внутри приложения. js

// pass s3Value to App2 class
<App2 s3Value={this.state.s3 />

Внутри приложения 2. js

constructor(props) {
       super(props);
       this.state = {
        z1:props.s3Value
       }
}

можно использовать реквизиты внутри конструктора, а также внутри метода render (), как показано ниже. И можно использовать внутри метода также 

render() {
    var z1= this.props.s3Value;
    ...
}
0 голосов
/ 11 февраля 2020

на банановой странице 

export const { userPrincipalName } = this.state.azureLoginObject;

на странице Apple 

import { userPrincipalName } from "./Banana";
0 голосов
/ 11 февраля 2020

Если ваше приложение protocol://host:port одинаково на всех ваших страницах, тогда вам подойдет localStorage.

Где бы вы ни устанавливали состояние на странице бананов 

_onLoginSuccess() {
    this.azureInstance.getUserInfo().then(result => {
      this.setState({
        loginSuccess: true,
        azureLoginObject: result,
      });
      const { userPrincipalName } = result;
      localStore.setItem('userPrincipalName', userPrincipalName);
      console.log(result);
    }).catch(err => {
      console.log(err);
    })
  }

Тогда на всех других страницах вы можете получить доступ 

const userPrincipalName = localStore.getItem('userPrincipalName');
0 голосов
/ 11 февраля 2020

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

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

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

...