用钩子更新图像时有问题吗？
用钩子更新图像时有问题吗？
提问于 2022-01-11 14:03:28
我不能用钩子更新图像。当我改变按下按钮的钩子状态时，图像保持不变。控制台日志只记录"1“。我怎么才能解决这个问题？
import React, { useState, useEffect } from 'react';
import {
Image,
Center,
NativeBaseProvider
} from "native-base";
const test1 = require('../src/img/testimg.png');
const test2 = require('../src/img/test2img.png');
const tests = {test1,test2};
export const Example = () => {
const [selected, setSelected] = useState(tests.test1);
return (
<View>
<Image
source={selected}
width= "100%"
height="100%"
alt="image"
/>
<Button onPress={() => {setSelected(tests.test2);console.log(selected)}}>Change Image</Button>
</View>
)
}
export default () => {
return (
<NativeBaseProvider>
<Center>
<Example/>
</Center>
</NativeBaseProvider>
)
}回答 1
Stack Overflow用户
发布于 2022-01-11 14:10:15
setSelected函数不同步，因此console.log(selected)不会记录新值。
但是，因为setSelected触发了重呈现，所以可以在console.log(selected)之前调用return，并让它显示新的值。
export const Example = () => {
const [selected, setSelected] = useState(tests.test1);
console.log(selected);
return (
<View>
<Image
source={selected}
width= "100%"
height="100%"
alt="image"
/>
<Button onPress={() => {
setSelected(tests.test2);
}}>Change Image</Button>
</View>
)
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/70668123
复制相关文章
相似问题
腾讯云开发者
