TypeScript 项目 移动版 两个滑块 滑动 （交叉）

index.tsx

import { Component } from "react";
import { connect } from 'react-redux';
import './index.less';

interface Props {

}
interface State {
  Num: number,
  MaxNum: number,
}


class Slider extends Component<Props, State>{
  constructor(props: Props) {
    super(props);
    this.state = {
      Num: 0,
      MaxNum: 100
    }
  }

  parent?: HTMLDivElement;
  child!: HTMLCollection;
  startX: number = 0;
  ballW: number = 0;
  oW: number = 0;
  x: number = 0;
  dis: number = 0;
  Num: number = 0;
  MaxNum: number = 0;
  scale: number = 0;

  FnStart(ev: React.TouchEvent) {
    this.startX = ev.changedTouches[0].pageX - (ev.target as HTMLDivElement).offsetLeft;
    this.parent = ((ev.target as HTMLDivElement).parentNode) as HTMLDivElement;
    this.child = this.parent.children;
    this.startX = ev.changedTouches[0].pageX - (ev.target as HTMLDivElement).offsetLeft;
    this.ball