A set of utility and general-purpose React hooks.
npm install @restart/hooks
import useInterval from '@restart/hooks/useInterval'
useInterval(() => loop(), 300, false)
A set of utility and general-purpose React hooks.
Home Page: https://react-restart.github.io/hooks/
License: MIT License
Hello, first of all thanks for great library!!!
I'm trying to do autoplay tabs and start use @restart/hooks
But useInterval hook fires first value immediately and this makes me sad
I expect that this happens after delay, can you help me with this?
Probably just a missed step in #9, but we should export the useMergedRef
hook from src/index.ts.
useRefWithInitialValueFactory is not importable via high level import of "@restart/hooks"... I have to use "import useRefWithInitialValueFactory from "@restart/hooks/useRefWithInitialValueFactory" instead.
Can you please add React 17 support?
There is PR: #42
Hi there,
useMap
and useSet
hooks don't trigger component render after adding an even amount of items.
You can find a code example here - https://codesandbox.io/s/unruffled-flower-kh57rp?file=/src/App.js
This happens because of using boolean
value in the useForceUpdate
hook which is used to trigger rendering in both useMap
and useSet
.
The code is calling setState
twice if useMergeState is used with function argument
const [state, mergeState] = useMergeState({ name: 'Betsy', age: 24 })
mergeState(state => ({ name: 'Johan' })) // <--- this calls setState twice
Shouldn't the code be like this?
const updater = (update: Updater<TState> | Partial<TState> | null) => {
if (update === null) return
if (typeof update === 'function')
setState(state => {
const nextState = update(state)
return nextState == null ? state : { ...state, ...nextState }
})
else {
setState(state => ({ ...state, ...update }))
}
}
Per https://npmjs.com/advisories/1523. It seems like it's only used for isEqual in useMutationObserver
https://reactjs.org/docs/refs-and-the-dom.html says that
ref
updates happen beforecomponentDidMount
orcomponentDidUpdate
lifecycle methods.
So, should we set it to false
initially here:
Line 24 in 91b4d9d
A small example would be really helpful for beginners :)
Reference: https://react-restart.github.io/hooks/api/useTimeout
I was checking out the production bundle for an app that uses lodash-es
and noticed that lodash
is also included.
Looking in package.json
for @restart/hooks
shows dependencies on both. And it looks like babel is doing an import rename to lodash-es
.
Is the dependency on lodash
still required?
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.