如何在react中设置子组件的状态？
如何在react中设置子组件的状态？
提问于 2018-11-01 15:45:35
在我的名为Grid.js的React组件中，我使用了一个名为Pagination的子组件。它看起来是这样的：
<StyledBox wrap py={12} px={18}>
<Header />
{state.data}
<Wrapper column justify="center" align="center" p={12}>
<Pagination onChange={this.handleChange} totalPages={10} />
</Wrapper>
</StyledBox>它是一个具有分页功能的网格。当用户在分页上选择一个页面时，将触发一个changeevent，并且网格的一个状态属性将被设置为state.data。问题是分页开始随机跳转:看起来组件上的状态发生了变化。
我是否必须将分页移出网格组件并使其不是子组件？
回答 1
Stack Overflow用户
发布于 2018-11-01 17:35:39
分页组件是随机跳转的，因为以前有特定长度的数据。那么当this.state.data改变时，数据的长度就不同了吗？因此，分页必须调整它的位置。在没有更多信息的情况下，这似乎是一个HTML和CSS问题。
尝试在分页组件css上设置position: fixed; bottom: 1rem，看看它是否仍然跳转。
另外，关于React组件，<Content /> and <Pagination /> components seem to be conceptually sibling and not parent-child related。因此，我将应用程序的结构类似于：
<ParentContainer>
<Header />
<Content data={this.state.data} />
<Pagination onChange={this.handleChange} totalPages={10} />
</ParentContainer>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/53097063
复制相关文章
相似问题
腾讯云开发者
