Comments (3)
I would suggest not rendering the Reflex container element if the size is 0,0, then once you have a non-zero size you make the first render. Can you try that and let me know if that helps. Thanks
from re-flex.
Hi @leefsmp , thanks for your reply. I have tried the solution you mentioned. However, this did not work in our application which requires the Reflex container element to be there at first render.
Currently, I'm working around it by setting flex: 0
at first when the size is zero and update the flex
props to 0.2
when the size is non-zero. This would trigger the layout computation. But this is just a work-around, I hope that there is a official solution for my use-case.
from re-flex.
I don't think there is another solution to it as far as I know unfortunately. There are some computations that cannot take place if the layout is 0. It strikes me that you would not be able to not render the layout if its size is 0,0. Basically what would you render if the size is 0,0, nothing... so why not skipping the rendering at all. I have to close this issue as it falls outside of the supported features of that lib. Maybe someone can come up with a better suggestion but seems a very edge case to me. I had to deal with 0,0 layouts before and doing the workaround of non-rendering has never been a problem so far.
from re-flex.
Related Issues (20)
- Component state is reinitialized when a ReflexElement is collapsing HOT 1
- React 18 typescript problem HOT 5
- Cannot read property 'ref' of undefined HOT 2
- React 18 peers dependency HOT 1
- Not working with nextjs HOT 9
- windowResizeAware horizontal container HOT 1
- ag-grid doesn't display in a resizable pane HOT 6
- Contrlled elemented example with functional components HOT 1
- Problem installing v4.0.11 on Yarn HOT 4
- node-sass as a dependency? HOT 1
- Where to find a description of version changes? HOT 1
- Reflex doesn't render properly when used in a <Suspense> HOT 2
- Question: Need to wrap "ReflexSplitter" inside "SplitterControl" component to add custom logic HOT 4
- Make component work with Content Security Policy by adding nonce attribute HOT 1
- Remove unnecessary console.logs from ReflexSplitter.js HOT 1
- Question: How to disable the ReflexSplitter? HOT 2
- can you add a new feature please HOT 2
- ReflexElement element size is not updated when the value passed to minSize prop is changed HOT 3
- react-reflex Doesn't Seem to Work as Expected Inside FrameComponent HOT 1
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 re-flex.