2022-06-17

1.vue中的阻止事件冒泡

            @click.stop = "clickFn"

2.uniapp中利用uview写u-popup弹出层，在弹出层中通过点击事件改变样式的字体颜色，背景颜色，当关闭时，字体颜色和背景颜色不能保存

设置一个index变量，当打开弹出框的时候，马上执行函数，不过其中有赋值操作，需要删除。

因为第二份变量的初始化是没有值的所以当打开的时候会报错误

Error in v-on handler: "TypeError: Cannot read property 'classList' of undefined"

found in

 需要用到&&操作符

//打开弹出框，保存其状态
			openFn() {
//第一个
				var $box = document.querySelectorAll('.box');
				$box.forEach((item, index) => {
					item.classList.remove('color-box')
				})
				$box[this.index1].classList.add('color-box');
//第二个
				var $boxbc = document.querySelectorAll('.box-bc');
				$boxbc.forEach((item, index) => {
					item.classList.remove('back-box')
				});
//小细节规避报错
				$boxbc[this.index2]&&$boxbc[this.index2].classList.add('back-box');
			},

3.uniapp返回上一级页面           

retunBackFn(){
       uni.navigateBack();     
}

4.css设置根据视口滚动来改变头部div的样式

第一步：给页面增加滚动监听事件

mounted() {
		    window.addEventListener("scroll", this.showIcon);
		},

 第二步：通过监