如何解决Nativescript-vue 监视道具
我的 ns-vue 应用程序在观看时遇到问题。我有基于此抽屉导航模板 https://plugins.nativescript.rocks/plugin/@nativescript/template-drawer-navigation-vue 的应用程序。我想对整个应用程序使用地理定位,因此我将此模块放置在 DrawerContent.vue 中。 在这个文件中,我将 props 传递给其他模块:
onNavigationItemTap(component) {
this.$navigateTo(component,{
clearHistory: true,props:{
latitude: this.latitude,longitude: this.longitude,}
});
utils.closeDrawer();
}
纬度和经度会定期更新。
在 Home.vue 上我有:
props:['latitude','longitude'],...
....
watch:{
latitude:()=>{
console.log('LAT change detected')
}
}
但这不起作用。我尝试了整个网络的很多选项,例如:
watch: {
$props: {
handler() {
this.parseData();
},deep: true,immediate: true,}
}
或
watch:{
'$props':()=>{
......
}
}
但仍然无法正常工作。
请帮忙,谢谢
解决方法
通过 Nativescript 导航传递的道具可能不是响应式的,反正我不会让抽屉组件处理这个功能。
如果您使用 Vuex,您可以将这些属性(或整个逻辑)移动到 store 并通过计算属性在您的组件中获取它们。如果您的代码可以重复使用,您还可以设置一个 mixin。
,vue 道具不是反应式的 https://vuejs.org/v2/guide/reactivity.html
但您可以将 object
作为包含 latitude
和 longitude
的属性传递:
data () {
return {
location: {
latitude: ...,longitude: ...,}
};
},...
this.$set(this.location,'latitude',latitude);
...
onNavigationItemTap(component) {
this.$navigateTo(component,{
clearHistory: true,props:{
location: this.location
}
});
utils.closeDrawer();
}
和观察者:
props:['location'],...
watch:{
'location.latitude' () {
console.log('LAT change detected')
}
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。