【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>
相关推荐
球球不吃虾17 分钟前
Nuxt在使用过程中的一些小总结(二)
前端·vue·nuxt
志尊宝13 小时前
Vue3 零基础每日笔记(038):亲手封装 useDebounceFn 与 useThrottleFn——高频事件的流量阀
前端·javascript·vue·html·vue3
三乐22818 小时前
一文搞懂 JS 事件流:捕获、冒泡、事件委托
javascript·html
PedroQue9918 小时前
uni-app x 事件通信插件重磅上线
前端·uni-app
强尼53018 小时前
WeasyPrint 技术入门指南——用 Web 技术生成 PDF 的专业库使用详解
html
IMPYLH19 小时前
HTML 的 <slot> 元素
前端·网络·html
乐迪绘防伪油墨技术分享20 小时前
特种功能油墨选型指南:温变 / 遇水 / 荧光 / UV LED 技术对比与供应商参考
前端·html·uv
愛芳芳21 小时前
基于 Electron + Vue3 的仿 PC 微信客户端项目实战
前端·javascript·css·elementui·typescript·electron·vue
梦想的颜色1 天前
【AI科普】AI 时代,纯 H5+CSS PK React & Vue:前端技术孰优孰劣深入剖析
ai·前端框架·大模型·vue·react·html5·vibecoding
阿虎儿1 天前
我的 HTML 样板(HTML Boilerplate)
前端·html