场景描述:
  有两个页面,列表页A和详细页B;打开列表页A,再打开详细页B;

  对详细页B编辑数据(如姓名),提交保存,返回列表页A,预期看到列表页A的数据已更新、页面已渲染;

  遇到的问题:列表页A的数据已更新、页面未渲染

  发现问题:更新数组元素 数组[索引]=元素;

  解决方法:更新数组元素要用 .splice(索引, 数量, 元素);

  详细页B的代码:

onUnload(){
	uni.$emit('staffInfoWatch', {id: this.staff_id});
}

  列表页A的代码:

onReady() {
	let _this = this;;
	uni.$on('staffInfoWatch',function(data){
		_this.getInfo(data);
	}); // 监听下级页面操作
},
onUnload() {
	uni.$off('staffInfoWatch');
},
methods: {
	async getInfo(data){
	let _this = this;
	let params = {id: data.id};
	if(data.id){
		let res = await your.request('m=staff&c=index', params);//向服务端获取该员工最新的数据
		if(res.error == 200){
			if(res.data.list.length == 1){
				let info = res.data.list[0];
				_this.list.forEach((item,index)=>{
					if(item.id == data.id){
						//_this.list[index] = info;//这样写只能更新数组,但是页面不渲染
						_this.list.splice(index, 1, info);//这样写,解决了问题。
						return;
					}
				})
			}
		}
	},
	//省略
}
Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐