javascript - 组件外的 React Native 更新视图
问题描述
我正在尝试从事件侦听器更新我的渲染/视图以做出本机反应。侦听器必须在视图或组件之外,有没有办法直接更新渲染/视图而不使用 state/setstate。现在它正在使用 react 挂钩进行更新,并且位于组件内部。
const App: () => React$Node = () => {
const [position, setposition] = useState({
lat: null,
lng: null,
foreground: false,
speed: null,
accuracy: null
});
useEffect(() => {
Mylocationlistener.on('location', (result) => {
setposition({
lat: result.location.latitude,
lng: result.location.longitude,
foreground: result.user.foreground,
speed: result.location.speed,
accuracy:result.location.accuracy
})
console.log('location listener:', stringify(result));
});
}, []);
return (
<>
<StatusBar barStyle="dark-content" />
<SafeAreaView>
<ScrollView
contentInsetAdjustmentBehavior="automatic"
style={styles.scrollView}>
<View style={styles.sectionContainer}>
<Text style={styles.sectionTitle}>My App{"\n"}</Text>
<Text style={styles.sectionTitle}>Location Tracker</Text>
</View>
{global.HermesInternal == null ? null : (
<View style={styles.engine}>
<Text style={styles.footer}></Text>
</View>
)}
<View style={styles.body}>
<View style={styles.sectionContainer}>
<Text style={styles.sectionTitle}>Latitude: {position.lat}</Text>
</View>
<View style={styles.sectionContainer}>
<Text style={styles.sectionTitle}>Longitude: {position.lng}</Text>
</View>
<View style={styles.sectionContainer}>
<Text style={styles.sectionTitle}>Speed: {position.speed}</Text>
</View>
<View style={styles.sectionContainer}>
<Text style={styles.sectionTitle}>Accuracy: {position.accuracy}</Text>
</View>
</View>
</ScrollView>
</SafeAreaView>
</>
);
};
解决方案
推荐阅读
- r - 使用 3 个不同的数据框时如何重新排序 x 轴?
- reinforcement-learning - 在 tf 2.0 中尝试在不构建函数的情况下捕获 EagerTensor
- c++ - 如何删除部分课程?
- firebase - Flutter 实时数据库:.childOrderBy() 未定义
- javascript - 根据变量隐藏链接html
- netezza - 错误:SPU 交换分区:磁盘临时工作空间已满,查询包含 row_number() over (partition by) 子句:Netezza
- c++ - Qt。如何在 QPrinterDialog 中选择默认打印机并禁用其余打印机?
- android - 在主要活动中更新时钟
- python - 在 Pandas 范围内填充随机浮点值的一列
- android - findViewById 不适用于使用 View.generateViewId 创建的 id