React Native - невозможно передать значение CheckBox на другой экран

Я здесь, чтобы спросить, как вы думаете, как правильно передать значение CheckBox на другой экран?

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

Но в моем коде мой console.info выводит false (я не понимаю, почему), и как только я перехожу на следующий экран, состояние на самом деле не проходит, потому что он отображается пустым.

Вот мой код

export default class tables extends Component {
constructor(props){
    super(props)
    this.state = {
        ...
        check: {},
        tbl_Merge: []
    }
}

proceed_TO_Category = () => {
    this.props.navigation.navigate('Category', {
        userName    : this.state.userName,
        DineIn      : this.state.DineIn,
        tbl         : this.state.tbl,
        tbl_2nd     : this.state.tbl_2nd,
        tbl_Merge   : this.state.tbl_Merge
    });
    console.info("CHECK ======> "+ this.state.tbl_Merge);
}

checkBox_Test = (table_NO) => {
    const tbl_Merge = this.state.tbl_Merge;
    const checkCopy = {...this.state.check}
    if (checkCopy[table_NO]) {
        checkCopy[table_NO] = false;
    } else {
        checkCopy[table_NO] = true;
    }
    this.setState({ check: checkCopy });
    this.setState({ tbl_Merge: table_NO == this.state.tbl_Merge });
}

render() {
    return(
         <View>
              ....
              <Flatlist
                    ....
                    <CheckBox
                       value = { this.state.check[item.tbl_id] }
                       onChange = {() => this.checkBox_Test(item.tbl_id) }
                    />
                    ....
              />
              ....
                    <View>
                        <TouchableOpacity
                            onPress = {() => this.proceed_TO_Category()}>
                            <Text>Categories</Text>
                        </TouchableOpacity>
                    </View>
         <View/>
    )
}
}

Снимок экрана Console.log в моем continue_TO_Category.React Native - невозможно передать значение CheckBox на другой экран

Какие у вас данные Flatlist? Специально tbl_id.

sdkcy 10.01.2019 15:47

мой флажок помещен в мой плоский список, и я также использую fetch для отображения некоторых элементов в моем плоском списке - я назвал их «tbl_id». Итак, для каждого элемента есть свой флажок.

Purple Violet 10.01.2019 15:54
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
0
2
380
1

Ответы 1

checkBox_Test = (table_NO) => {
    const tbl_Merge = this.state.tbl_Merge;
    const checkCopy = {...this.state.check}
    if (checkCopy[table_NO]) {
        checkCopy[table_NO] = false;
    } else {
        checkCopy[table_NO] = true;
    }
    this.setState({ check: checkCopy, tbl_Merge: table_NO == this.state.tbl_Merge }); // 1. Edit
}
  1. Обновлено: мы не должны использовать setState последовательно. Поскольку setState является асинхронной функцией. Если вы хотите вызвать функцию после процесса setState с помощью функции обратного вызова, setState(update, callback);

  2. вы определили tbl_Merge как массив, но пока вы устанавливаете его в состояние, вы устанавливаете его как логическое значение.

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