Reactjs 需要将边界设置为div，并使用react手势和react spring启用拖动

我正在使用

react-use-signature

包在拖动事件中移动div，但需要设置边界

我需要使用spring的插值方法来设置这些边界，还是应该向

useSpring（）.set

方法添加参数

如果没有velocity，这不会有问题，但我需要

useSpring（）.set

方法上的velocity参数

import{useSpring，interpolate，animated，config}来自“react spring”；
从“反应-使用手势”导入{useDrag}；
导出默认函数App（）{
常量[{pos}，set]=useSpring（（）=>（{pos:[0，0]}））；
const bind=useDrag(
({
xy，
以前的
下来,，
移动
方向，
速度
备注=位置getValue（）
}) => {
设置({
位置：添加（移动、备忘录），
立即：向下，
配置：{
是的，
速度：比例（方向、速度），
衰退：真的
}
});
返回备忘录；
}
);
返回(
`translateX（${x}px）`）
}}
>
);
}

import { useSpring, interpolate, animated, config } from "react-spring";
import { useDrag } from "react-use-gesture";

export default function App() {
  const [{ pos }, set] = useSpring(() => ({ pos: [0, 0] }));
  const bind = useDrag(
    ({
      xy,
      previous,
      down,
      movement,
      direction,
      velocity,
      memo = pos.getValue()
    }) => {
      set({
        pos: add(movement, memo),
        immediate: down,
        config: {
          clamp: true,
          velocity: scale(direction, velocity),
          decay: true
        }
      });
      return memo;
    }
  );
  return (
    <animated.div
      {...bind()}
      className={"mydiv"}
      style={{
        transform: pos.interpolate(x => `translateX(${x}px)`)
      }}
    >

    </animated.div>
  );
}