如bug描述中所说的，代码也已贴出
1***@qq.com
- 发布：2020-11-02 22:38
- 更新：2022-08-19 13:19
- 阅读：1226
产品分类： uniapp/App
PC开发环境操作系统： Windows
PC开发环境操作系统版本号： win10
HBuilderX类型： 正式
HBuilderX版本号： 2.9.6
手机系统： Android
手机系统版本号： Android 10
手机厂商： OPPO
手机机型： r15 梦镜版
页面类型： vue
打包方式： 云端
项目创建方式： HBuilderX
操作步骤：
预期结果：
可以动态修改原生子窗体的宽度和高度
可以动态修改原生子窗体的宽度和高度
实际结果：
动态修改原生子窗体的宽度和高度失败，子窗体全屏显示了
动态修改原生子窗体的宽度和高度失败，子窗体全屏显示了
bug描述：
在APP中，subNVue动态设置原生子窗体宽度和高度失败
pages.json文件
{
"path": "pages/bbs/videoDetail/videoDetail",
"style": {
"navigationStyle": "custom",
"navigationBarTextStyle": "black",
"subNVues": [
{
"id": "header",
"path": "pages/bbs/videoDetail/subNVue/head",
"style": {
"position": "absolute",
"width": "750rpx",
"height": "44px",
"left": "0px",
"top": "0px",
"background": "transparent"
}
}
]
}
},head.nvue
<template>
<view id="header">
<view class="w-videoHeader">
<image src="../../../../static/write-back.png" class="w-videoHeaderBack"></image>
<image src="../../../../static/write-more.png" class="w-videoHeaderMore"></image>
</view>
</view>
</template>
<script>
export default {
}
</script>
<style>
.w-videoHeader{
position: relative;
z-index: 2;
width: 100%;
}
.w-videoHeaderMore{
width: 48rpx;
height: 48rpx;
position: absolute;
left: 30rpx;
bottom: 20rpx;
}
.w-videoHeaderBack{
width: 23rpx;
height: 40rpx;
position: absolute;
left: 30rpx;
bottom: 20rpx;
}
</style>videoDetail.vue页面
<template>
<view class="video_detail">
<button type="default" @click="myclick" style="width: 50%;height: 100rpx;background-color: #8788A3;margin: 0 auto;margin-top: 100px;">{{clickText}}</button>
</view>
</template>
<script>
export default{
data(){
return{
header: ''
clickText: "事件",
}
}
onLoad(e) {
this.header = uni.getSubNVueById('header');
this.header.show('slide-in-left', 300);
},
methods:{
myclick(){
this.header.setStyle({
"position": "absolute",
"left": "0",
"top": "0",
"width": "150px",
"height": "111px",
"background": "#f00"
})
this.clickText = "已点击事件"
},
}
}
</script>
