Reactjs抽屉动画影响页面上的其他元素

时间:2017-01-22 08:29:17

标签: javascript reactjs reactcsstransitiongroup

示例图片提供了一个票价想法:

sample image giving a fare idea.

我有两个主要组件

  1. 第一个组件( NewsFeed )默认状态为展开大小(1000px)
  2. 第二个组件(聊天)默认状态为已折叠(200px),其中只有人名头像显示在列表中。
  3. 两个聊天子组件

    1. PeopleList ,用于呈现人员列表。默认状态为可见,大小为200px(聊天组件的大小为已折叠状态。)
    2. ChatBox ,用于呈现用户与其员工之间的对话。默认状态为隐藏,大小为400px。
    3. 场景

      1. 点击聊天组件中的人名会展开它,显示附加在 PeopleList 右侧的 ChatBox 组件,其中 >聊天声明更改为展开 ChatBox 状态为可见 NewsFeed 组件更改为< em>已折叠状态,其大小已缩小,以便在新状态(展开)中容纳聊天组件。
      2. 感谢。

0 个答案:

没有答案