uni-app实现点击显示隐藏列表,兼容微信小程序

效果: 

uni-app实现点击显示隐藏列表,兼容微信小程序_第1张图片


				
					{{item.title}}
					
				
				
					
						{{c.title}}
					
				
				

 

listData:[
					{
						title:"新疆",
						isToggle:false,
						content:[
							{title:"新疆大明矿业1"},
							{title:"新疆大明矿业2"}
						],
					},
					{
						title:"山东",
						isToggle:false,
						content:[
							{title:"山东矿业1"},
							{title:"山东矿业2"}
						],
					}
],
handleToggle(item,index1){
	item.isToggle = !item.isToggle;
	console.log(item.isToggle,"item.isToggle")
}

小程序打印的结果:值一直为true

 

如果你试过v-if不生效,又试了v-show,还是不行!!千万不要着急!

不是自己写的不对,而是uni-app和微信小程序修改值的方式不一致造成的。反正就是不承认是自己的问题。

其实解决的办法也很简单,就是要兼容两端,写出符合让两端都适合的代码 。

既然这样直接修改值不行,那就从根本出发。

handleToggle(item,index1){
	// item.isToggle = !item.isToggle;
	this.listData.forEach((item,index)=>{
		if(index1 === index){
			item.isToggle = !item.isToggle;
		}
	})
	console.log(item,"item.isToggle")
}

uni-app实现点击显示隐藏列表,兼容微信小程序_第2张图片

你可能感兴趣的:(小程序,javascript,uni-app,uni-app,微信小程序)