{"action":"created","issue":{"url":"https://api.github.com/repos/ant-design/ant-design-mobile/issues/2790","repository_url":"https://api.github.com/repos/ant-design/ant-design-mobile","labels_url":"https://api.github.com/repos/ant-design/ant-design-mobile/issues/2790/labels{/name}","comments_url":"https://api.github.com/repos/ant-design/ant-design-mobile/issues/2790/comments","events_url":"https://api.github.com/repos/ant-design/ant-design-mobile/issues/2790/events","html_url":"https://github.com/ant-design/ant-design-mobile/issues/2790","id":352462503,"node_id":"MDU6SXNzdWUzNTI0NjI1MDM=","number":2790,"title":"ListView 自定义容器的吸顶问题","user":{"login":"tequilaNiu","id":5114240,"node_id":"MDQ6VXNlcjUxMTQyNDA=","avatar_url":"https://avatars1.githubusercontent.com/u/5114240?v=4","gravatar_id":"","url":"https://api.github.com/users/tequilaNiu","html_url":"https://github.com/tequilaNiu","followers_url":"https://api.github.com/users/tequilaNiu/followers","following_url":"https://api.github.com/users/tequilaNiu/following{/other_user}","gists_url":"https://api.github.com/users/tequilaNiu/gists{/gist_id}","starred_url":"https://api.github.com/users/tequilaNiu/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/tequilaNiu/subscriptions","organizations_url":"https://api.github.com/users/tequilaNiu/orgs","repos_url":"https://api.github.com/users/tequilaNiu/repos","events_url":"https://api.github.com/users/tequilaNiu/events{/privacy}","received_events_url":"https://api.github.com/users/tequilaNiu/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":0,"created_at":"2018-08-21T09:41:39Z","updated_at":"2018-08-21T09:41:40Z","closed_at":null,"author_association":"NONE","body":"- [ ] I have searched the [issues](https://github.com/ant-design/ant-design-mobile/issues) of this repository and believe that this is not a duplicate.\r\n\r\n### What problem does this feature solve?\r\n在自定义容器里面的吸顶功能，react-sticky 是可以在相对容器里面吸顶的 <Sticky relative={true} />，此时有N个<Sticky> 都放在一个<StickyContainer>内部时，可以实现相对容器的吸顶，例如：\r\n<StickyContainer style={{height: '500px', overflowY: 'auto'}}>\r\n{\r\n    [1,2,3,4,5].map(i => (\r\n        <Sticky relative={true} />\r\n    ))\r\n}\r\n</StickyContainer>\r\n\r\n但是在我们ListView组件里面，由于Sticky 和 StickyContainer分别设置在renderSectionHeader和renderSectionWrapper中，这样就会导致有多个StickyContainer。\r\n我还分别尝试了将StickyContainer放在renderBodyComponent中或者包裹在<ListView>组件外，都有问题。\r\n\r\n### What does the proposed API look like?\r\nrenderBodyComponent: () => (\r\n  <StickyContainer>{this.props.children}</StickContainer>\r\n)\r\n\r\n\r\n<!-- generated by ant-design-issue-helper. DO NOT REMOVE -->"},"comment":{"url":"https://api.github.com/repos/ant-design/ant-design-mobile/issues/comments/414615680","html_url":"https://github.com/ant-design/ant-design-mobile/issues/2790#issuecomment-414615680","issue_url":"https://api.github.com/repos/ant-design/ant-design-mobile/issues/2790","id":414615680,"node_id":"MDEyOklzc3VlQ29tbWVudDQxNDYxNTY4MA==","user":{"login":"ant-design-bot","id":26566442,"node_id":"MDQ6VXNlcjI2NTY2NDQy","avatar_url":"https://avatars0.githubusercontent.com/u/26566442?v=4","gravatar_id":"","url":"https://api.github.com/users/ant-design-bot","html_url":"https://github.com/ant-design-bot","followers_url":"https://api.github.com/users/ant-design-bot/followers","following_url":"https://api.github.com/users/ant-design-bot/following{/other_user}","gists_url":"https://api.github.com/users/ant-design-bot/gists{/gist_id}","starred_url":"https://api.github.com/users/ant-design-bot/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/ant-design-bot/subscriptions","organizations_url":"https://api.github.com/users/ant-design-bot/orgs","repos_url":"https://api.github.com/users/ant-design-bot/repos","events_url":"https://api.github.com/users/ant-design-bot/events{/privacy}","received_events_url":"https://api.github.com/users/ant-design-bot/received_events","type":"User","site_admin":false},"created_at":"2018-08-21T09:41:40Z","updated_at":"2018-08-21T09:41:40Z","author_association":"NONE","body":"Translation of this issue:\n\n<hr/>\n\n## ListView Custom container ceiling problem\n\n- [ ] I have searched the [issues](https://github.com/ant-design/ant-design-mobile/issues) of this repository and believe that this is not a duplicate.\r\n\r\n### What problem does this feature solve?\r\nIn the custom container's ceiling function, the react-sticky is a <Sticky relative={true} /> that can be ceilingd in the opposite container. When N <Sticky> are placed inside a <StickyContainer>, Can achieve ceiling relative to the container, for example:\r\n<StickyContainer style={{height: '500px', overflowY: 'auto'}}>\r\n{\r\n    [1,2,3,4,5].map(i => (\r\n        <Sticky relative={true} />\r\n    ))\r\n}\r\n</StickyContainer>\r\n\r\nBut in our ListView component, since Sticky and StickyContainer are set in renderSectionHeader and renderSectionWrapper respectively, this will result in multiple StickyContainers.\r\nI also tried to put the StickyContainer in the renderBodyComponent or wrapped it outside the <ListView> component.\r\n\r\n### What does the proposed API look like?\r\nrenderBodyComponent: () => (\r\n  <StickyContainer>{this.props.children}</StickContainer>\r\n)"}}
{"actor":{"display_login":"ant-design-bot"}}