Comments (3)
I am not convinced that this is a responsibility of the linter to report such behavior 🙂 Statically analyzing the code would not result in enough information to determine that setCounterRender
will cause an endless loop.
Moreover, in some cases, the code snippet you provided is the wanted behavior, as in some cases shouldRender
may be falsy. That is why it would not be easy to stop such behavior even during runtime.
All in all, I have no easy idea on how to implement such verification, therefore I am closing this issue. If you, or anyone else, has an implementation idea, feel free to create a PR 🙂
from tslint-react-hooks.
Thanks for posting an issue 🙂
Are you sure that useState
inside useEffect
does not result in any violations? For me, the following snippet:
function MyComponent() {
React.useEffect(() => {
React.useState(() => {
})
})
}
results in a rightful rule violation:
Could you share a snippet of this case that does not result in a rule violation? 🙂
from tslint-react-hooks.
Hi, I just found that, in some case likes:
const [currentRenderCounter, setRenderCounter] = useState(0);
useEffect(() => {
if (shouldRender) {
setRenderCounter(counter => counter + 1);
console.log(currentRenderCounter);
...
Will cause infinite loop of rendering.
But in some case, it's fine to use state in useEffect
... I'm still confise why some times it works.
The safe way is to useRef:
const renderCounter = useRef(0);
useEffect(() => {
if (shouldRender) {
renderCounter.current += 1;
console.log(renderCounter.current);
...
from tslint-react-hooks.
Related Issues (18)
- Early return? HOT 16
- Report error in nextjs file HOT 1
- Rule reports false positive for anonymous component returned from a function HOT 6
- Not warning about custom hooks as properties HOT 2
- Provide support for .tsx files HOT 4
- Confused with rules HOT 5
- tslint-react-hooks rules not working in my atom HOT 1
- Doesn't work with React.memo or React.forwardRef (maybe others) HOT 4
- [Bug] Unable to enable "warning" mode HOT 3
- Support globbing import style HOT 5
- Supporting option to whitelist non-hook functions
- extend supported component decorators HOT 3
- Wrong message for anonymous functions HOT 2
- shows as warning regardless of rules declaration HOT 9
- independently-controllable rules HOT 6
- Integrate this to tslint-react HOT 8
- [Feature Request] Exhaustive deps lint rule integration in tslint react hook HOT 7
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from tslint-react-hooks.