使用$on接收数据的时候,this指向会出现问题。
index.vue页面发送数据
<input type="text" value="" placeholder="请输入城市名称" @confirm="searchCity"/>
methods: {
searchCity:function(event){//@confirm命名空间不能有括号,不然报错
//console.log(event.detail.value)
uni.navigateBack({
delta:1
})
uni.$emit('sendCityInfo',{cityName:event.detail.value})
}
}
Locationchoose.vue页面接收数据
data() {
return {
Location:"城市选择"
}
},
onLoad() {//$on拿到的数据,this指针会出问题
let _this = this
uni.$on('sendCityInfo',function(data){
console.log(data.cityName)
// this.Location = data.cityName //视图失效
_this.Location = data.cityName//必须这样
})
}
就是this指针的小bug。如果直接使用this指针赋值给Location,页面可以拿到数据,但却不会把数据渲染到视图上,也就是视图层不能及时刷新导致的,这时候必须要更改this指针(也就是let _this = this)。