Блог

Главная - Вопросы по программированию - Вывод состояния с нескольких экранов на один экран?

Вывод состояния с нескольких экранов на один экран?

#react-native #navigation

#react-native #навигация

Вопрос:

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

При добавлении я устанавливаю isAdding, при редактировании я устанавливаю isEditing, а при отображении деталей я устанавливаю isShowDetail и перемещаюсь по ним, вот так.

Экран A:

 this.props.navigation.navigate(ROUTE_INVOICE_DETAIL_NAME, { invoice, isEditing: true });

и экран B (Подробности):

 constructor(props) {
    super(props);
    this.isShowDetail = props.navigation.getParam("isShowDetail");
    console.log(this.isShowDetail);
    this.isAdding = props.navigation.getParam("isAdding")
    this.isEditing = props.navigation.getParam("isEditing");
    const { params = {} } = this.props.navigation.state;
    const { invoice = {} } = params;
    const { paid = 0, incurred = 0, transportFee = 0, id} = invoice;
    this.state = {
        id,
        invoice,
        isShowTicketDetail: false,
        customer: {},
        paid,
        incurred,
        transportFee,
        details: {},
    };

Я не знаю, как получить isEditing и isAdding значение, оно возвращает undefined.

ROUTE_INVOICE_DETAIL_NAME объявлено, и я уверен, что это подробно описано.

Комментарии:

1. Похоже, вы используете react-navigation? Я бы ожидал, что props.navigation.getParam («isEditing») даст вам то, что вы хотите. Метод getParam является вспомогательным, и вы также можете просмотреть все параметры навигации из props.navigation.state.params — вы могли бы попробовать console.log(props.navigation.state.params) и посмотреть, есть ли там то, что вы ожидаете.

2. Кроме того, это для вас деталь стиля: но похоже, что вы иногда устанавливаете isEditing , иногда устанавливаете isAdding , а иногда устанавливаете isShowDetail . Никогда не имело бы смысла устанавливать ни один из них, и никогда не имело бы смысла устанавливать два или три из них. Я бы, вероятно, вызвал строковый параметр mode или что-то в этом роде и установил бы для него значение SHOW_DETAIL , CREATE и EDIT . Тогда вам не нужно проверять 3 разных логических значения, вы можете просто проверить наличие 3 разных вариантов одного поля.

Ответ №1:

На экране A:

 this.props.navigation.navigate(ROUTE_INVOICE_DETAIL_NAME, {
                    invoice_data: invoice ,
                    isEditing: true
                })

На экране B вы можете получить данные, подобные этому :

 let invoice_data = this.props.navigation.state.params.invoice_data
let isEditing = this.props.navigation.state.params.isEditing