Предотвращение реактивных навигационных экземпляров экрана

Автор оригинала: Kuldeep.

Быстрое решение проблем, с которыми сталкивается Реагистрационная навигация Предотвратите навигацию дважды, нажав кнопку быстро # 271

ПРИМЕЧАНИЕ. Это работает вокруг для реактивной навигации (V1), в V2 эта проблема фиксирована.

Содержание

Содержание Multitaphandler. Применение Пример Заключение

Multitaphandler.

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

export default (func, wait = 500) => {
    let tapCount = 0;
    let handler;

    return function() {
        if (tapCount === 0) {
            tapCount++;
            func();
        }
        // Clear the previous timeout and set a new one.
        clearTimeout(handler);
        handler = setTimeout(() => (tapCount = 0), wait);
    };
};

Применение

onPress={multipleTapHandler(() => this.doSomethingCool())}

Пример

С реакцией

import React, { Component } from 'react';
import { TouchableOpacity } from 'react-native';
import PropTypes from 'prop-types';
import multipleTapHandler from 'multipleTapHandler';

class Button extends Component {
  render() {
    return (
       this.props.onPress(), this.props.ignoreMultipleTouches ? 500 : 0)}
      />
    );
  }
}

Button.defaultProps = {
  ignoreMultipleTouches: false
};

Button.propTypes = {
  ignoreMultipleTouches: PropTypes.bool
};

export default Button;

Без реакции

import multipleTapHandler from 'multipleTapHandler';

// Tap Event
const onTap = () => {
  console.log("onTapEvent called.")
}

// Actual user Tap.
tap = multipleTapHandler(() => {onTap()})

// Helper
const sleep = (ms) => {
  return new Promise(resolve => setTimeout(resolve, ms));
}

async function main() {
  // Loops mimics the user tap frequency.
  for (let i=0; i < 10; i++){
    tap()
    // tapping this 10 times after every 100 milliseconds.
    await sleep(100)
  }
}

main()

Заключение

Спасибо за чтение этого поста – надеюсь, вы нашли это полезным. Вы можете найти меня на Github , LinkedIn и Кодаментар Отказ Если у вас есть какие-либо вопросы, не стесняйтесь добраться до меня! Другие сообщения:

Настройка вашего навигационного ящика в KIVY & KIVYMD
Plyer: Platform Независимый слой совместимости
Управление текстурой в Киве с использованием атласа
Учебное пособие на новичком Киве: базовый курс сбоя для приложений в Киве
Redux, Store, Действия, Редукторы и регистратор: Начните и немного дальше