uni-app蒙板弹窗无法覆盖tabbar的问题
这个解决办法我是用的是nvue原生渲染,具体操作如下:
创建以.nvue为后缀文件,然后在pages.json里引用(在哪个页面下使用,就在那个模块里引用)
pages.json:
"path": "pages/index/index",
"style": {
"navigationBarTitleText": "",
"navigationBarTextStyle": "black",
"enablePullDownRefresh":true,
"backgroundColor":"#ffffff",
"app-plus": {
"animationAlphaBGColor": "#070C20",
"scrollIndicator":"none",
"subNVues":[{
"id":"popup",
"path":"./components/subNvue/open",
"type":"popup",
"style": {
"position": "absolute",
"dock": "right",
"width": "300px",
"height": "500px",
"left":"0px",
"top":"0px",
"background": "transparent"
}
}]
}
}
在页面中使用的时候要调用方法
openWindows(param) {
let that = this
let content = '';
let winWidth
let winHeight
// 缩写法
//uni.getSubNVueById('popup').show();
// 对子窗体添加一些自定义的配置
// 通过 ID 获取 subNVues 原生子窗体的实例
//获取的"popup"要和pages.json里面配置的id一致(非常重要,否侧会报错)
const subNVue = uni.getSubNVueById('popup');
// const subVue = uni.getSubNVueById("popup");
//向子窗口传入参数
uni.$emit('hello-popup', {
type: param,
content: content,
winWidth: winWidth,
winHeight: winHeight,
})
// 设置子窗口的样式
subNVue.setStyle({
width: winWidth,
height: winHeight,
})
subNVue.show('slide-out-top', 3000);
},
.nvue的使用方法
created() {
const _that = this;
// 接收信息的页面
uni.$on('hello-popup', (data) => {
_that.content = data.content;
_that.winWidth = data.winWidth;
_that.winHeight = data.winHeight;
});
const checkAll = uni.getCurrentSubNVue()
checkAll.addEventListener("hide",function(){
},false)
},
我在.nvue文件中使用封装的网络请求时会报错,没有找到解决办法的小伙伴可以使用uni的网络请求
uni.request({
url:'http://......',
data:{id:this.id},
method:"POST",
header:{'X-Requested-With': 'XMLHttpRequest','Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'},
timeout:5000,
success:async (res)=>{
console.log(res)
},fail(Error){
console.log(Error)
uni.showToast({title:"网络异常",duration:1000});
}
});
具体详细的一些问题 请参考 uniapp.dcloud.io/tutorial/nv… uni-app官方文档