当组合使用antd-mobile的Tabs 和 ListView的时候,上拉的时候让本该固定的Tabs被隐藏

当组合使用antd-mobile的Tabs 和 ListView的时候,发现ReactDOM.findDOMNode(ref.current).offsetTop查找ListView该dom节点的offsetTop为0,导致上拉的时候让本该固定的Tabs却被隐藏掉了,如下

const hei = height - ReactDOM.findDOMNode(ref.current).offsetTop;

 { changeTabs(tab, index); }} tabs={tabs} tabBarUnderlineStyle={{ borderBottomWidth: 0.7, borderBottomColor: '#004CDF', width: '10%', textAlign: 'center', left: '5%' }} renderTabBar={props => }>
           Pull to refresh}
            renderFooter={() => (
{isLoading ? 'Loading...' : 'Loaded'}
)} renderRow={row} // renderSeparator={separator} useBodyScroll={useBodyScroll} style={useBodyScroll ? {} : { height: height, border: '1px solid #ddd', margin: '5px 0', }} pullToRefresh={} onEndReached={onEndReached} pageSize={5} />

解决方法:官方组件的问题,子panel没有offsetTop高度,目前折中的方法是,给Tabs一个设定的高度,然后写死ListView的ReactDOM.findDOMNode(ref.current).offsetTop为50

 #{"/deep/"} .am-tabs-tab-bar-wrap{
        box-sizing: border-box;
        position: relative;
        height: 50px;
        line-height: 50px;
    }
const hei =  height - 50

然后问题就解决了
github相关问题传送门:https://github.com/chendishen/bugList

你可能感兴趣的:(当组合使用antd-mobile的Tabs 和 ListView的时候,上拉的时候让本该固定的Tabs被隐藏)