Bağımlılıkları geri alan özel bir kanca nasıl oluşturulur?

Bazı eyalet değiştiğinde bir toogle olan özel bir kanca yapıyorum.

Bir dizideki herhangi bir durumu geçirebilmeniz gerekir.

import { useState, useEffect } from 'react'

const useFlatListUpdate = (dependencies = []) => {
    const [toggle, setToggle] = useState(false)

    useEffect(() => {
        setToggle(t => !t)
    }, [...dependencies])

    return toggle
}

export default useFlatListUpdate

Ve şu şekilde kullanılmalıdır:

const toggleFlatList = useFlatListUpdate([search, selectedField /*, anything */])

Ama bana şu uyarıyı veriyor

React Hook useEffect'in bağımlılık dizisinde bir forma öğesi var. Bu, doğru bağımlılıkları geçip geçmediğinizi statik olarak doğrulayamayacağımız anlamına gelir. Eslint (tepki kancaları / ayrıntılı deps)

Ayrıca işe yaramadığı başka bir durum daha var

const useFlatListUpdate = (dependencies = []) => {
    const [toggle, setToggle] = useState(false)

    useEffect(() => {
        setToggle(t => !t)
    }, dependencies)

    return toggle
}

Bu bana uyarı veriyor

React Hook useEffect, dizi değişmezi olmayan bir bağımlılık listesine geçirildi. Bu, doğru bağımlılıkları geçip geçmediğinizi statik olarak doğrulayamayacağımız anlamına gelir. Eslint (tepki kancaları / ayrıntılı deps)

Uyarı yapmadan ve eslint'i devre dışı bırakmadan bu işi nasıl yapabilirim?

— Vencovsky
kaynak

Haklısın. Cevabım yanlış. Seni ve başkalarını daha fazla karıştırmamak için sildim. Özür dilerim dance

— dance2die

@ dance2die Cevabınız yanlış değildi, ama başka bir tür uyarı verdi.

— Vencovsky

Nazik sözler için teşekkürler. Ben de refs ile çalışma alamadım bu yüzden bu konuyu başkalarına bırakacağım :)

— dance2die

ikinci örneğiniz için bağımlılıkları bir dizinin içine koyun:useEffect(() => { setToggle(t => !t) }, [dependencies])

— Jon B

Bu durumda bağımlılık listesinin kullanımı çok tuhaftır.
Uyarıyı görmezden gelmek veya susturmak dışında başka bir yol göremiyorum.

Uyarıyı susturmak için eslinttamamen devre dışı bırakmamız gerekmez .
Bu belirli satır için bu belirli kuralı devre dışı bırakabilirsiniz:

const useFlatListUpdate = (dependencies = []) => {
    const [toggle, setToggle] = useState(false)

    /* eslint-disable react-hooks/exhaustive-deps */
    useEffect(() => {
        setToggle(t => !t)
    }, [...dependencies])

    return toggle
}

— ckedar
kaynak