uni app subNVues层级组件
<h4>参数设置</h4><pre>position 原生子窗体的排版位置，排版位置决定原生子窗体在父窗口中的定位方式。
"static"，原生子窗体在页面中正常定位，如果页面存在滚动条则随窗口内容滚动；
"absolute"，原生子窗体在页面中绝对定位，如果页面存在滚动条不随窗口内容滚动；
"dock"，原生子窗体在页面中停靠，停靠的位置由dock属性值决定。 默认值为"absolute"。
dock 原生子窗体的停靠方式,仅当原生子窗体 "position" 属性值设置为 "dock" 时才生效，可取值："top"，原生子窗体停靠则页面顶部；"bottom"，原生子窗体停靠在页面底部；"right"，原生子窗体停靠在页面右侧；"left"，原生子窗体停靠在页面左侧。 默认值为"bottom"。
mask 原生子窗体的遮罩层,仅当原生子窗体 "type" 属性值设置为 "popup" 时才生效，可取值： rgba格式字符串，定义纯色遮罩层样式，如"rgba(0,0,0,0.5)"，表示黑色半透明；
width 原生子窗体的宽度,支持百分比、像素值，默认为100%。未设置width属性值时，可同时设置left和right属性值改变窗口的默认宽度。
height 原生子窗体的高度,支持百分比、像素值，默认为100%。 当未设置height属性值时，优先通过top和bottom属性值来计算原生子窗体的高度。
top 原生子窗体垂直向下的偏移量，支持百分比、像素值，默认值为0px。 未设置top属性值时，优先通过bottom和height属性值来计算原生子窗体的top位置。
bottom 原生子窗体垂直向上偏移量,支持百分比、像素值，默认值无值（根据top和height属性值来自动计算）。 当同时设置了top和height值时，忽略此属性值； 当未设置height值时，可通过top和bottom属性值来确定原生子窗体的高度。
left 原生子窗体水平向左的偏移量，支持百分比、像素值，默认值为0px。 未设置left属性值时，优先通过right和width属性值来计算原生子窗体的left位置。
right 原生子窗体水平向右的偏移量，支持百分比、像素值，默认无值（根据left和width属性值来自动计算）。 当设置了left和width值时，忽略此属性值； 当未设置width值时，可通过left和bottom属性值来确定原生子窗体的宽度。
margin 原生子窗体的边距，用于定位原生子窗体的位置，支持auto，auto表示居中。若设置了left、right、top、bottom则对应的边距值失效。
zindex 原生子窗体的窗口的堆叠顺序值，拥有更高堆叠顺序的窗口总是会处于堆叠顺序较低的窗口的前面，拥有相同堆叠顺序的窗口后调用show方法则在前面。
动画方式
slide-in-right slide-out-right 新窗体从右侧进入
slide-in-left slide-out-left 新窗体从左侧进入
slide-in-top slide-out-top 新窗体从顶部进入
slide-in-bottom slide-out-bottom 新窗体从底部进入
fade-in fade-out 新窗体从透明到不透明逐渐显示
zoom-out zoom-in 新窗体从小到大缩放显示
zoom-fade-out zoom-fade-in 新窗体从小到大逐渐放大并且从透明到不透明逐渐显示
pop-in pop-out 新窗体从左侧进入，且老窗体被挤压而出
none none 无动画
</pre>
<pre> // subNVues 覆盖webview
this.$scope.$getAppWebview().append(this.webview);
// webview append后在创建
this.subNVue = uni.getSubNVueById('gmenu');
this.subNVue.show('slide-in-bottom', 300, () => {});
// 退出 或 返回到其他页面 时候用
uni.redirectTo({
url: '/pages/home/index'
});
// 使用的页面 通过 id 获取 nvue 子窗体
const subNVue = uni.getSubNVueById('promote');
subNVue.show('', 250, () => {
uni.$emit('promote', this.promotionData);
});
// 子nvue页面，必须是nvue
</pre>
<div class="popup-share"> </div>
<style>.popup-share { display: flex; justify-content: center; align-items: center; position: relative }
.popup { position: absolute; left: 0; top: 0 }
.popup-btn { position: absolute }
.popup-close { position: absolute }</style>
pages.json里面
<pre> {
"path" : "pages/player/player",
"app-plus": {
"softinputMode": "adjustResize"
},
"style" :
{
"navigationBarTitleText": "",
"enablePullDownRefresh": false,
"app-plus": {
"subNVues": [
{
"id": "promote",
"path": "components/modal/modal-promote",
"type": "popup",
"style": {
"position": "dock",
"dock": "bottom",
"width": "676rpx",
"height": "800rpx",
"margin": "auto",
"background": "transparent"
}
}
]
}
}
</pre>
<style>body { font-family: "Merriweather", serif; margin: 0; padding: 0; color: rgba(58, 58, 58, 1); line-height: 1.7; background-color: rgba(248, 248, 248, 1) }
h1, h2, h3 { color: rgba(53, 68, 88, 1); font-weight: 700 }
a { color: rgba(52, 152, 219, 1); text-decoration: none }
a:hover { text-decoration: underline }
pre { margin-top: 4px; background-color: rgba(240, 240, 240, 1); padding: 12px; border-radius: 4px; overflow: auto; font-family: "Courier New", monospace }
ul { list-style-type: none; padding-left: 0 }
#cnblogs_post_body ul { margin-left: 8px }
#cnblogs_post_body ul li { list-style-type: none }
li { margin-bottom: 15px }
p.note { color: rgba(192, 57, 43, 1); font-style: italic; margin-top: 5px }
.title { color: rgba(51, 51, 51, 1); text-align: center; margin: 40px 0 }
.note2 { color: rgba(0, 128, 0, 1) }</style><br><br>
来源：https://www.cnblogs.com/anans/p/15162503.html
頁:
[1]