1.0.0 • Published 3 years ago

react-moving-l v1.0.0

Weekly downloads
-
License
MIT
Repository
github
Last release
3 years ago

安装

使用

const App: any = () => {

  const [isClick, setIsClick] = useState(false)

  const onLocation = (location: objectLocation): void => {
    console.log(location)
  }

  const getMoveTime = (time: number):void => {
    if (!!time && time < 100) {
      setIsClick(!isClick)
    }
  }
  return (
    <div>
      <Renderer
        onLocation={(location: objectLocation) => onLocation(location)}
        moveStartTimeToEndTime={(time: number) => getMoveTime(time)}
        translateX={100}
        translateY={100}
      >
        <MoveComponent isClick={isClick} />
      </Renderer>
      <div>菜谱</div>
    </div>
  );
};

API

字段类型默认值含义
childrenReactNodeNull
islimitInBrowserbooleanfalse是否限制物体脱离在边界
childrenWidthnumber0children存在,width,height 能优化平移过后的距离
childrenHeightnumber0children存在,width,height 能优化平移过后的距离
distanceArray10, 10, 10, 10开启islimitInBrowser 有效, 上,右,下,左 默认都是10
translateXnumber0初始化X位置
translateYnumber0初始化Y位置
onLocationFunction/每次移动的坐标
moveStartTimeToEndTimeFunction/每次移动结束返回的时间