const Overlay = posed.View({
open: {
y: 0,
delayChildren: 300,
staggerChildren: 300,
staggerDirection: 1
},
closed: { y: '100vh', delay: 300 }
});
const Item = posed.View({
open: { x: 0, opacity: 1 },
closed: { x: 100, opacity: 0 }
})
<Overlay pose={isVisible ? 'open' : 'closed'}>
<Wrapper>
{
items.map((item)=> (
<Item key={item.id} >
<Card
item={item}
active={active}
length={items.length}
onPress={(id)=>{this.handleSelect(id)}}
/>
</Item>
))
}
</Wrapper>
</Overlay>
卡片
<TouchableNativeFeedback
onPress={()=> onPress(item.id)}
background={TouchableNativeFeedback.SelectableBackground()}
hitSlop={{top: 0, bottom: 0, left: 50, right: 50}}
>
<TouchableWrapper
style={{
height: 150-15*(length>2? length : 1),
}}
>
<TextWrapper
style={{
color: active===item.id?'#ffffff': '#000000'
}}
>
{item.title}
</TextWrapper>
</TouchableWrapper>
</TouchableNativeFeedback>
我的 hitslop 在 TouchableNativeFeedback 中不起作用。但是,如果我忽略/注释掉覆盖部分,则 hitslop 可以正常工作。不确定为什么我的 TouchableNativeFeedback 没有响应 hitslop
$Overlay = posed.View()
包的github链接: 提前感谢链接。