使用uni-app原生字窗口subNvue*

最新推荐文章于 2024-04-29 04:19:57 发布
最新推荐文章于 2024-04-29 04:19:57 发布
阅读量547 收藏
点赞数
分类专栏： uni uni原生子窗口 文章标签： vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/B2689429488/article/details/110873806
版权
本文档介绍了如何在uni-app中创建和配置原生子窗口subNvue，包括在pages文件夹下新建文件夹及文件、在pages.json中配置以及参数传递的注意事项。特别提示，uni子窗口页面不支持已封装好的接口，需要直接调用接口。
摘要由CSDN通过智能技术生成

参考文档:https://uniapp.dcloud.io/api/window/subNVues
1.在pages文件夹下,新建文件夹及文件,并写好要实现的页面内容.如图
在这里插入图片描述
在这里插入图片描述

2.在pages.json中给需要页面使用的原生窗口subNvue配置

{
   
			"path": "pages/login/personal",  //需要配置的页面
			"style": {
   
				"enablePullDownRefresh": true,
				"app-plus": {
   
					"subNVues": [{
   
						"id": "Nvueshare", // 唯一标识
						"path": "pages/subvue/subNvue", // 子窗体路径  
						"type": "popup",
最低0.47元/天 解锁文章
B2689429488
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
uniapp原生子窗体subNvue的使用超容易理解的总结，解决覆盖不了视频或者地图等层级问题
2401_83947194的博客
03-30 929
path”: “pages/index/drawer.nvue”, // nvue 路径“style”: { //webview style 子集，文档可暂时开放出来位置，大小相关配置“position”: “popup”, //除 popup 外，其他值域参考 5+ webview position 文档}, {//弹出层“style”: {}]}]subNVues的id是全局唯一的，不能重复可以通过获取subNVues的实例subNVues的path属性只能是nvue文件路径。
uni-app中使用subNVue和制作带video的swiper
m0_47703222的博客
10-19 2702
关于uni-app中带有video的swiper，还有subnvue的踩坑记录及解决
uniapp开发app原生子窗体subNvue的使用
weixin_43090018的博客
01-05 8795
用uniapp开发app的时候经常会有以下问题： 1、覆盖原生导航栏、tabbar 的弹出层组件。比如侧滑菜单盖不住地图、视频、原生导航栏，比如 popup盖不住tabbar。 2、弹出层内部元素可滚动, 3、在map、video等组件上的添加复杂覆盖组件：比如直播视频上覆盖滚动的聊天记录 虽然有cover-view来覆盖原生组件，但是在app-vue中不支持嵌套，且只能在map、video组件使用 这个时候用原生子窗体是比较适合的 1、使用前配置page.json 在 pages.json 中，新增
uniapp：使用subNVue原生子窗体在map上层添加自定义组件
1111111111
10-17 1083
1、创建一个nvue页面，也就是需要在map上层显示的组件，这是子组件，原生子窗体只能用nvue开发，必须遵循nvue的语法规则，很多uniapp组件在nvue里使用不了，很多css也使用不了，这是比较考验耐心的，开发前多研究一下nvue和vue的区别。我们想要在地图上层添加自定义组件，比如一个数据提示框，点一下会展开，再点一下收起，在h5段显示正常，但是到app端真机测试发现组件显示不出来，这是因为map是内置原生组件，层级最高，自定义组件被挡住了，无论如何设置自定义组件的z-index都没有用。
uni-app调用Android原生可以实现通信及打开WiFi
01-13
【uni-app调用Android原生实现通信及打开WiFi】\n\nuni-app是一个跨平台的前端框架，允许开发者使用一套代码编写应用，同时在iOS、Android、H5等多个平台上运行。在uni-app中，通过调用原生插件，我们可以实现与...
使用uni-app搭建的企业OA app
03-23
【标题】：“使用uni-app搭建的企业OA app” 【描述】提到这是一个个人实践作业，因此可能存在不完善之处，由于制作者自认能力有限，可能采用了较为基础的方法进行开发，并且项目只包含了前端部分。 【标签】：...
Android uni-app 封装原生插件 -.pdf
11-09
【Android uni-app 封装原生插件】 在移动应用开发中，uni-app是一个流行的跨平台框架，它允许开发者使用一套代码实现iOS、Android、Web等多个平台的应用。然而，有时为了充分利用特定平台的功能，我们需要使用原生...
uni-crazy-router:一个更贴合uni-app的router插件，一切都使用uni-app原生钩子实现和方法实现，抛弃了vue-router的影子
03-21
一个更贴合uni-app的router插件，一切都使用uni-app原生钩子实现和方法实现，抛弃了vue-router的影子 qq群：701697982 注意 由于条件限制，仅在H5环境和微信小程序环境，以及app端android和ios环境进行过测试感谢某...
uni-app 富文本编辑 回显富文本和修改富文本！
11-21
uni-app 富文本编辑 回显富文本和修改富文本！uni-app 富文本编辑 回显富文本和修改富文本！uni-app 富文本编辑 回显富文本和修改富文本！uni-app 富文本编辑 回显富文本和修改富文本！uni-app 富文本编辑 回显富...
uni-app subNVue 原生子窗体开发指南
球球不吃虾WHR2349博客
08-04 2683
此功能需要 HBuilderX 版本 1.9.10+， 不支持非自定义组件模式。 需求背景 在我们的开发中，经常会遇到各种层级覆盖和原生界面自定义的问题： 覆盖原生导航栏、tabbar 的弹出层组件。比如侧滑菜单盖不住地图、视频、原生导航栏，比如 popup盖不住tabbar。 弹出层内部元素可滚动, 在地图、视频等组件上的添加复杂覆盖组件：比如直播视频上覆盖滚动的聊天记录。 在小程序中只能用 cover-vi...
前端学习（2347）：创建新页面和配置
歌谣的博客
10-04 762
pages.json { "pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages { "path" : "pages/message/message", "style" : { "navigationBarTitleText": "信息页", "navigationBarBackgroundColor": "#7FFF00", "h5":{ ..
Vue 组件间的通信(1)
最新发布
2401_84436058的博客
04-29 520
父组件向子组件传递数据。：自定义事件。：插槽分发内容，带上标签数据一起传输，主要是父组件想子组件传输。组件间通信规则。
uniapp原生子窗体subnvue(弹出层确认取消)
dream_wx的博客
06-29 1036
【代码】uniapp原生子窗体subnvue(弹出层确认取消)
【uniapp】原生子窗体subNvue的使用与踩坑
每天进步一点点, 靠近小目标一点点~
08-09 2047
覆盖原生组件, 官方给出解决办法一. 使用cover-view标签 二. 使用subNvue原生子窗体, 或者Nvue
uniapp开发APP如何使用subNVues（map,video组件必备技能）
热门推荐
mengmeng1_的博客
03-02 1万+
在开发中，经常会遇到各种层级覆盖和原生界面自定义的问题： 原生导航栏渐变背景色、灵活自定义内容 覆盖原生导航栏、tabbar 的弹出层组件。比如侧滑菜单盖不住地图、视频、原生导航栏，比如 popup盖不住tabbar。 弹出层内部元素可滚动, 在地图、视频等组件上的添加复杂覆盖组件：比如直播视频上覆盖滚动的聊天记录。 在小程序中只能用 cover-view 来解决。 App中就有三种方法： 1、c...
uniapp在video上面使用添加nvue页面覆盖
asasa的博客
04-09 4490
uniapp在video上面使用添加nvue一、uniapp引入配置nvue页面video页面代码覆盖层nvue页面代码补充遇到的问题 由于video的层级过高，普通dom遮盖不了，所以需要使用uniapp的subNVue来进行覆盖。 一、uniapp引入配置nvue页面 创建一个nvue页面 在pages.json中找到需要被覆盖的页面，在下面添加subNVues { "path": "pages/theatre/theatreDetails", "style": { "navig
vue路由传参的两种方式,实现返回上个页面不刷新
anny_mei的博客
07-17 9942
我的项目是当在新增页面(下面叫A页面)先提交一些数据,然后跳转到下一个页面(下面叫B页面)再填写数据,然后返回到新增的页面 之前我直接跳转回B页面goback(),这样的话跳转回来A页面就什么数据都没有了 解决方法有两种,一种是在地址栏里面拿参数 this.$router.push({ name:'xxxxxxxxx', // 跳转的页面名称 params:{ id:this.id || "xxxxxxxxxx" } }) 在
uni-app原生综合小程序模板
01-01
uni-app 是一个基于 Vue.js 的开发框架，允许开发者使用同一套代码，同时发布到多个平台，包括小程序。uni-app 原生综合小程序模板是 uni-app 提供的一种模板，用于开发原生小程序应用。它集成了常见的功能模块，提供了丰富的组件和API，方便开发者快速搭建小程序应用。 这个模板主要包括了页面布局、组件库、网络请求、页面跳转和数据管理等方面的功能。开发者可以通过该模板快速创建一个基础的原生小程序应用，然后根据自己的需求进行定制和扩展。比如，可以利用模板提供的组件库快速构建页面，使用网络请求模块获取数据，通过页面跳转和数据管理实现页面交互等功能。 uni-app 原生综合小程序模板也具有一定的灵活性，开发者可以根据自己的需求进行定制，添加自定义组件和模块，以满足特定的业务需求。同时，该模板也提供了丰富的文档和示例，方便开发者学习和使用。 总之，uni-app 原生综合小程序模板是一个能够帮助开发者快速构建原生小程序应用的工具，提供了丰富的功能模块和组件，同时也具有一定的灵活性，能够满足不同开发需求。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值