收藏
回答

真机上view覆盖不了canvas的问题?

<view class="switch-block" :class="{'switch-block-show': isSwitchShow}">
				<image class="icon" :src="prodImgHttp + '/switch.png'" mode="widthFix" @tap="handleSwitch"></image><view class="btn" @tap="toggleOrientation">{{isPortrait?'切换横屏':'切换竖屏'}}</view>
			</view>
			<view class="item">
				<view class="ctitle">
					<text>身高曲线图</text>
				</view>
				<canvas style="z-index: 10;" :style="{ width: canvasWidth + 'px', height: canvasHeight + 'px' }" canvas-id="column" id="column" class="charts" @touchstart="touchstart" @touchmove="touchmove" @touchend="touchend"/>
			</view>

.item {
		margin-bottom: 30px;
		width: 100%;
		position: relative;
		z-index: 999;
		.ctitle {
		    font-size: 17px;
		    font-weight: 600;
		    padding: 15px;
		    position: relative;
			::after {
				content: "";
				position: absolute;
				left: 0;
				top: 50%;
				transform: translateY(-50%);
				width: 4px;
				height: 19px;
				background-color: #FC7C23;
			}
		}
	}
	
	.switch-block {
		display: flex;
		align-items: center;
		position: fixed;
		right: -78px;
		top: 30%;
		z-index: 1000;
		transition: right ease 0.6s;
		background-color: #FC7C23;
		border-top-left-radius: 10px;
		border-bottom-left-radius: 10px;
		padding: 8px 10px;
		.icon {
			width: 30px;
		}
		.btn {
			font-size: 16px;
			font-weight: 500;
			color: #ffffff;
			margin-left: 10px;
		}

}

在模拟器上显示没问题,真机上显示不行,是为什么呢?

两个都有父元素包裹,且父元素都设置了z-index,为什么switch-block覆盖不了item呢?

回答关注问题邀请回答
收藏
登录 后发表内容