uniapp 仿写弹窗

本文主要是介绍uniapp 仿写弹窗，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

页面

<template><view @click="close" class="mask"><view @click.stop="onClick" class="content"><text class="text">点击蒙层关闭</text></view></view>
</template><script>export default {data() {return {}},methods: {onClick(e) {uni.showToast({title: "点击蒙层关闭"})// #ifdef APP-NVUEe.stopPropagation()// #endif},close() {uni.navigateBack()}}}
</script><style>page {background: transparent;}.mask {position: fixed;left: 0;top: 0;right: 0;bottom: 0;/* #ifndef APP-NVUE */display: flex;/* #endif */justify-content: center;align-items: center;background-color: rgba(0, 0, 0, 0.4);}.content {width: 200px;height: 200px;background-color: #007AFF;}.text {/* #ifndef APP-NVUE */display: block;/* #endif */line-height: 200px;text-align: center;color: #FFFFFF;}
</style>

manifest.json 配置

	{"path": "pages/popup/popup","style": {"navigationStyle": "custom","backgroundColor": "transparent","app-plus": {"animationType": "fade-in","background": "transparent","popGesture": "none"}}}

预期效果

这篇关于uniapp 仿写弹窗的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---