如何构建可以改变视图类型react组件
如何构建可以改变视图类型react组件
提问于 2019-05-09 09:49:02
我正在工作的reactjs项目需要建立一个可以改变视图类型的组件。Like:组件有"view as icon“和"view as list"，并且有一个按钮可以相互切换。最好的办法就是把它归档。谢谢
编辑:很抱歉把你弄糊涂了，这正是我想要的。如你所见，我有一个mediaComponent，我希望它能以两种不同的方式显示:列表和缩略图。那么我该如何使用react来做到这一点呢？我实际上没有这方面的代码。
p/s:我尝试过条件渲染，但因为渲染不同，所以需要用forceUpdate()重新渲染组件。这看起来可不太好。所以我有另一种解决方案。
回答 1
Stack Overflow用户
发布于 2019-05-09 10:40:46
可能是这样的：
class MyComponent extends React.Component {
state = {
isList: false
}
toggleList = () => this.setState({ isList: !this.state.isList})
render(){
const { isList } = this.state;
return (
<div>
{isList ? <ListComponent /> : <GridComponent />}
<button onClick={this.toggleList}>Toggle</button>
</div>
)
}
}
export default MyComponent;页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/56056725
复制相关文章
相似问题
腾讯云开发者
