当前位置: 首页 > 工具软件 > Remax > 使用案例 >

(记)在remax中实现小程序的实现屏幕的滑动事件

澹台星光
2023-12-01
 <View style={num === 1 ? 'background:red' : ''} className={styles.app} onTouchStart={(enevt) => {
      moveStart(enevt)
    }} onTouchMove={(enevt) => {
      move(enevt)
    }} onTouchEnd={(enevt) => {
      moveEnd(enevt)
    }}>
 </View>
  const [start, setStart] = React.useState()
  const [end, setEnd] = React.useState()
  const [number, setNumber] = React.useState(0)
  let numNO = 0
  const moveStart = (e) => {
    setStart(e.touches[0].pageX)
    timer.current = setInterval(() => {
      numNO++
      setNumber(numNO)
      console.log(numNO);
    }, 100)
  }
  const move = (e) => {
    setEnd(e.changedTouches[0].pageX)
    if (start - end <= -40 && number < 10) {
      console.log('向右')
    }
    else if (start - end >= 40 && number < 10) {
      console.log('向左')
    }
  }
  const moveEnd = (e) => {
    console.log(start, end);
    clearInterval(timer.current);
  }

原生链接https://blog.csdn.net/crazytea/article/details/53228755

 类似资料: