JSX内部的 if-else语句没有按预期工作

Question

我试图在使用React Native reanimated点击时将图像动画化，但JSX if else条件不太正确。下面是有效的代码，但只有在第一次点击时才有效。状态被设置为true，所以当再次点击时，它应该将大小设置回原来的大小，图像应该回到原来的大小，反之亦然。

设置如下:

export default () => {
const newNumber = useSharedValue(100);
const [Toggled, setToggled] = useState(false);
const style = useAnimatedStyle(() => {
return {
width: withSpring(newNumber.value),
height: withSpring(newNumber.value, {  damping: 10,
stiffness: 90, }),

};
});
onPress={() => {
{Toggled ? newNumber.value = 100 : newNumber.value = 350; setToggled(true)}
}}

问题是，当我尝试添加newNumber.Value = 100时，设置toggle为false，它给了我一个错误。我试着这样添加:

{Toggled ? newNumber.value = 100; setToggled(false) : newNumber.value = 350; setToggled(true)}

为什么它接受第一个而不接受第二个?

如果我使用这个，它工作，但它可以做其他方式吗?

const isToggled = Toggled;

if (isToggled) {
// alert('Is NOT Toggled');
newNumber.value = 100;
setToggled(false)
} else {
// alert('Is Toggled');
newNumber.value = 350;
setToggled(true)
}

感谢

Answer 1

看起来您只是根据Toggled设置一个值为newNumber，然后将Toggled设置为相反的值。所以为什么不

onPress={() => {
newNumber.value = Toggled ? 100 : 350
setToggled(prev=>!prev)
}}