Как создать общее состояние между двумя пользовательскими крючками React? - PullRequest
Новая
       10

Как создать общее состояние между двумя пользовательскими крючками React?

0 голосов
/ 17 мая 2019

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

function usePrevPage(page) {
    const [lastPage, setLastPage] = useState(page);
    const handleLastPage = () => {
        setLastPage(page => page - 1);
    }
    useEffect(() => {
      handleLastPage();
    },[page]);
    return [lastPage, handleLastPage];
}

function useNextPage(page) {
    const [nextPage, setNextPage] = useState(page);
    const handleNextPage = () => {
        setNextPage(page => page + 1);
    }
    useEffect(() => {
      handleNextPage();
    },[page]);
    return [nextPage, handleNextPage];
}

В настоящее время наличие одной и той же переменной конфликтует друг с другом.Например, 

const [page, handleLastPage] = usePrevPage(2)
const [page, handleNextPage] = useNextPage(2)

не допускается, поскольку page уже было объявлено в первом.Как настроить так, чтобы между ними было общее состояние?

1 Ответ

3 голосов
/ 17 мая 2019

Использовать только один крючок? 

function usePage(initial) {
    const [page, setPage] = useState(initial);
    return [page, () => setPage(page - 1), () => setPage(page + 1)];
}

//...
const [page, prev, next] = usePage(1);
...