Javascript 强制进给在速度JS下不工作
我正在尝试在我的一个React项目中使用VelocityJS。我面临问题的用例是: SVG中创建了指针,最初位于屏幕的中心。我想用键盘上的箭头键移动指针。我维护了一个状态变量,用于更新keydown事件指针的X和Y值。在setState的回调中,我调用了一个translate函数,该函数为翻译设置动画。但我面临的问题是,动画总是从指针的初始位置开始,即屏幕的中心。因此,我尝试的一种解决方法是,使用velocityJS中的强制进给,将指针的先前位置也保持在状态。有人检查我的代码,看看我是否做错了什么Javascript 强制进给在速度JS下不工作,javascript,jquery,reactjs,animation,velocity.js,Javascript,Jquery,Reactjs,Animation,Velocity.js,我正在尝试在我的一个React项目中使用VelocityJS。我面临问题的用例是: SVG中创建了指针,最初位于屏幕的中心。我想用键盘上的箭头键移动指针。我维护了一个状态变量,用于更新keydown事件指针的X和Y值。在setState的回调中,我调用了一个translate函数,该函数为翻译设置动画。但我面临的问题是,动画总是从指针的初始位置开始,即屏幕的中心。因此,我尝试的一种解决方法是,使用velocityJS中的强制进给,将指针的先前位置也保持在状态。有人检查我的代码,看看我是否做错了什
这并不能回答您的问题,但在我看来,即使您可以将jQuery或其他DOM操作库与React混合使用也不是一个好主意,因为React与虚拟DOM一起工作。从未使用过,但对您来说可能是一个更好的选择。这并不能回答您的问题,但在我看来,即使您可以将jQuery或其他DOM操作库与React混合使用,也不是一个好主意,因为React与虚拟DOM一起工作。从未使用过,但可能是一个更好的选择。
$(".Aim").velocity(
{
translateX: [this.state.aimX, this.state.aimXOld],
translateY: [this.state.aimY, this.state.aimYOld]
},
{
duration: 500,
easing: [0.46, 0.46, 0.46, 0.46],
complete: () => {
console.log("completed");
}
}
);