React-Native-版高仿淘宝、京东商城首页、商品分类页面

outputRange: [0, -36], // 将上边距改为从0～-36
extrapolate: ‘clamp’ // 滚动超出0～160的范围，不在更改边距
})

return (
<AnimatedTouchableOpacity
style={styles.top_search_container(marginRight, marginTop)}
activeOpacity={0.8}
onPress={this.gotoSearch}

{'新品'} ) }

GoodsCategory.js 解析

render() {
return (


// 一级分类列表，采用FlatList
<FlatList
ref={refs => this.flatList = refs}
keyExtractor={(item, index) => index.toString()}
data={this.state.firstCategoryData}
renderItem={this.renderFirstCategoryItem}
ItemSeparatorComponent={this.renderSeparatorLine}
/>


// 二级、三级分类列表，采用SectionList
<SectionList
ref={refs => this.sectionList = refs}
renderSectionHeader