应用情况:a界面点击确认按钮,可以将选中的数据参数传到上一个界面b中去,并且刷新上一个界面a的数据。
b页面布局:

<van-button class="save" round type="info" block bindtap="saveChange">确认</van-button>

b页面执行方法saveChange:

saveChange:function(){
	const _this = this;  //此处将this的值附到_this中,防止与其他的this值发生冲突
	let userList = [];  //定义一个userList的数组,用来存放选中数据
	let pages = getCurrentPages();  //获取当前界面的所有信息
	let prevPage = pages[pages.length-2];
	//获取上一页的所有信息

	_this.data.tabList[_this.data.tabIndex].list.forEach((value)=>{
		//因为我需要的是list中的值,而list在tabList中,所以我如果要调用list中的name值,那么我就要对tabList进行遍历。
		//_this.data.tabList[]数组根据_this.data.tabIndex,即指定的tabList[i]中找到list,并且用forEach方法遍历list获取值
	  if(_this.data.checkedValue.indexOf(value.id.toString())>-1){
	  	//checkedValue为复选框中选中的值
	  	//indexOf为以字符串形式返回value.id首次出现的位置,并且这个位置>-1,即合法的
	    userList.push(value)
	    //将userList中的值push推出来
	  }
	})
	prevPage.setData({  //将要传递的值直接在此处setData,上一个页面就会执行这里的操作
	  userList
	})
	wx.navigateBack({
	  detal:1,  //返回上一级页面
	})
},
checkedChange(event){
	console.log(event.detail)
	this.setData({
		checkedValue: event.detail,
	})
}

a页面所设置的预留布局
在此处根据id对userList进行循环,将item.name展示出来

<view class="user_wrap">
    <view class="name_wrap" wx:for="{{userList}}" wx:key="id" >
      {{item.name}}
    </view>
</view>

使用userList表的循环对数据进行读取显示在页面中,是一种常用的前端显示数据方法。

Logo

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

更多推荐