1
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链接: 提前感谢链接。

4

0 回答 0