【uniapp/uView】解决消息提示框悬浮在下拉框之上

需要实现这样的效果,即 toast 消息提示框在 popup 下拉框之上:

解决方法,把 <u-toast ref="uToast" /> 放在 u-popup 里面即可,这样就可以提升 toast 的优先级:

html 复制代码
<!-- 弹出下拉框 -->
			<u-popup :show="evaluateShow" @close="evaluateClose" @open="evaluateOpen">
				<div>
					<u-toast ref="uToast" />
					<div style="padding: 10px;border-bottom: 1px solid #f5f5f5;">评价分数</div>
					<u-textarea style="padding: 10px;" v-model="scoreVal" placeholder="请输入内容"></u-textarea>
					<div style="padding: 10px;border-bottom: 1px solid #f5f5f5;">作业评价</div>
					<u-textarea style="padding: 10px;" v-model="workVal" placeholder="请输入内容"></u-textarea>
					<u-upload style="padding: 10px;" :fileList="picList" @afterRead="afterRead"
						@delete="deletePic"></u-upload>
					<u-button type="primary" text="提交" @click="evaluateReasonClick"
						style="background-color: #0081CC;"></u-button>
				</div>
			</u-popup>
相关推荐
释怀不想释怀33 分钟前
vue(登录,退出,浏览器本地存储机制)
前端·javascript·vue.js·ajax·html
曲幽1 小时前
FastAPI响应实战:从JSON到HTML,轻松驾驭多种数据格式
python·html·json·fastapi·web·jinja2·responses
web小白成长日记1 小时前
什么是margin重叠,如何解决
前端·css·html·css3
莫生灬灬1 小时前
VueMultiBrowser - 开源多浏览器管理器
运维·开发语言·chrome·c#·自动化·vue
William_cl1 小时前
【C# ASP.NET】局部视图 @Html.Partial 全解析:复用 UI 的正确姿势(附避坑指南)
c#·html·asp.net
JackieDYH12 小时前
HTML+CSS+JavaScript实现图像对比滑块demo
javascript·css·html
冥界摄政王1 天前
Cesium学习第二章 camera 相机
node.js·html·vue3·js·cesium
韩曙亮1 天前
【Web APIs】移动端轮播图案例 ( 轮播图自动播放 | 设置无缝衔接滑动 | 手指滑动轮播图 | 完整代码示例 )
前端·javascript·css·html·轮播图·移动端·web apis
千寻技术帮1 天前
10356_基于Springboot的老年人管理系统
java·spring boot·后端·vue·老年人
PieroPc1 天前
Html +css+js 写的一个小商城系统(POS系统)
javascript·css·html