我接受useSelector
我需要的主题类型的状态,我在 settings.item.colorScheme
.
我有一个BottomSheet
允许我点击选择的语言来改变它,这个改变改变了redux
sosettings
的状态useSelector
。
问题是内部的状态useCallback
不会改变,至少它只在bottomSheet
菜单关闭然后重新打开时才会改变。
我怎么能在里面定义的里面useCallback
看到更新的状态?
我试图将它作为参数传递给useCallback
,但它不起作用。
代码:
const dispatch = useDispatch();
const settings = useSelector((state) => state.settings);
const { present, dismiss } = useBottomSheetModal();
const theme = [
{ title: 'Light', value: 'light' },
{ title: 'Dark', value: 'dark' }
];
const bottomSheetTheme = useCallback(
(newValue, id) => {
present(
<View style={{ flex: 1, backgroundColor }}>
<Text>{settings.item.colorScheme}</Text>
{theme.map(({ title, value }) => {
return (
<TouchableWithoutFeedback
key={value}
onPress={() => {
//dismiss();
changeButtonTheme(value);
}}>
<View
style={[
Layout.row,
Layout.rowHCenter,
Gutters.tinyVMargin,
Gutters.tinyHMargin,
]}>
<View style={[Layout.fill]}>
<Text>{title}</Text>
</View>
{settings.item.colorScheme === value ? (
<Svgs.RadioButton size={32} color={backgroundColor} />
) : (
<Svgs.RadioButtonEmpty size={32} color={backgroundColor} />
)}
</View>
</TouchableWithoutFeedback>
);
})}
</View>,
{
snapPoints: ['25%'],
animationDuration: 10,
overlayComponent: BottomSheetOverlay,
overlayOpacity: 0.5,
dismissOnOverlayPress: true,
//handleComponent: handle,
//backgroundComponent: BlurredBackground,
//onChange: handleChange,
}
);
},
[settings]
);