|
You admitted yourself you've never really used them in practice. I would never having simply read some docs on Rust's borrow checker having never used it, go to some discussion of experts online and nerdsnipe with a pithy "It's a bad interface" comment without having ever seriously tried it. You're not being a jerk, just a jerk-off. You're talking out of your ass for fun and you admit you've never actually used it, and your poor example show it clearly. I mean really, think about it. I was honestly interested in seeing if you had some unique insight but your example has no relation at all to hooks, it would only solve useState but has nothing to do with useEffect which is equally if not more important. You replaced the old React `this.setState` basically and not at all hooks, it's a syntax many have done before, that I had personally invented ~7 years ago well before hooks and used it on a small app, and which solves none of the problems they solve. And now you want me to personally educate you? At first I was going to just leave it at this conversation, but you know what, fine, here's your example: function Component(props: { isActive: boolean }) {
const [query, setQuery] = useState('')
const queryDebounced = useDebouncedValue(query, 200)
const searchResults = useSearch(queryDebounced)
const results = useLastValueWhen(searchResults, !props.isActive)
return <>
<input onChange={e => setQuery(e.target.value)} />
{results.map(result => <ResultItem {...result} />)}
</>
}
// these two are easy to write out so leaving out
const useDebouncedValue = () => // debounce hook
const useLastValueWhen = (a, b) => // hook that retains last a when b == true
const useSearch = (query: string) => { // can be used elsewhere
return useFetch(`http://localhost/search?query=${query}`)
}
const useFetch = (url: string, args?: any) => {
const [state, setState] = useState([])
useEffect(() => {
let alive = true
fetch(url, args).then(res => {
if (alive) setState(res)
})
return () => {
alive = false
}
}, [url, args])
return state
}
Please do show your example of this. |