angularjs – 创建主细节模式,使用响应式设计框架隐藏移动设备上的详细视图

前端之家收集整理的这篇文章主要介绍了angularjs – 创建主细节模式,使用响应式设计框架隐藏移动设备上的详细视图前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我正在寻找使用主 – 细节模式,其中主主视图包含项目列表并单击它在详细视图中加载与该项目相关的所有信息.使用bootstrap或foundation都可以正常工作.我还可以隐藏手机的详细视图.

我想要做的是点击主视图中的项目我想在移动设备中将视图更改为详细视图.我认为可以通过一些jquery隐藏主视图并在移动设备上显示详细视图.我不确定这是否是正确的方法,我想知道人们是如何解决这个问题的.任何angularjs / react特定建议都会更好.

解决方法

我的方法是让主视图的className由封闭组件中的状态确定.就像是;

<MasterView className={this.state.masterViewClass} />

(显然已更改为适合您的代码,您可能希望将此应用于特定标记而不是整个反应元素).

单击主视图的元素时,相应地更改它的masterViewClass,利用bootstraps Responsive Utilities隐藏您不希望显示的元素.

猜你在找的Angularjs相关文章