如何在微信小程序中使用webview脚手架 - 行业资讯 - 肥雀云

　　介绍

这期内容当中小编将会给大家带来有关如何在微信小程序中使用webview脚手架,文章内容丰富且以专业的角度为大家分析和叙述,阅读完这篇文章希望大家可以有所收获。

<强>项目介绍

1.微信

使用芋头创建的初始化项目

2。react-ssr-h6

使用nextjs创建的项目已经做好完整的兼容处理使用大众vh为单位

<强>简单介绍

因小程序对于webview通信做出的限制从webview发起的postMessage并不会实时的被小程序端接受到

详情可见:https://developers.weixin.qq.com/miniprogram/dev/component/web-view.html

登录分享支付视频上传这几块是没法使用webview来实现的必须用小程序原生来写

所以如果想使用小程序内嵌webview的朋友这里要提个醒

<强> webview跳转小程序

webview -通过jumpRouter——跳转到小程序的其他页面

实际转换:

<代码>芋头。navigateTo({网址:. ./. ./页面/otherView/指数? viewName=$ {routerName},代码+ createRouterParams (routerParams)})

通过这种方式就会在小程序原生路由器中推动一个路由从而达到跟小程序打开原生页面一致的效果

在webview中发起的任何一个postMessage也都会在这个otherView中进行统一的处理

<强>提醒

下面使用到的apitool都是对应项目里面的而不是共用一个

<强>微信api

,,小程序项目中跳转页面并传参　　jumpNativeRouter才能　　使才能用方式: 　　apitool.jumpNativeRouter才能(routerName params :对象) ,,替换小程序网页页面　　replaceRouter才能　　使才能用方式: 　　apitool.replaceRouter才能(routerName params :对象) ,,获取临时缓存区数据　　getTemp才能　　使才能用方式: 　　Object 才能;apitool.getTemp () 　　备才能注: 　　请才能见缓存区说明 ,,销毁临时缓存区　　clearTemp才能　　使才能用方式: 　　apitool.clearTemp才能() 　　备才能注: 　　请才能见缓存区说明

<强> react-ssr-h6 api

,,获取小程序分享以后的路径,转换成obj的格式　　getSharePath才能　　使才能用方式: 　　Object 才能;apitool.getSharePath () ,,获取路由参数　　getRouterParams才能　　使才能用方式: 　　Object 才能;apitool.getRouterParams () ,,获取转换以后的尺寸　　,getSize 　　使才能用方式: 　　String 才能;apitool.getSize(大小) 　　备才能注: 　　因才能为ssr项目里面使用了postcss-px-to-viewport的关系在少里面写的px会自动转换成vw 但是行内样式不行,所以你需要使用这个来转换一下获取当前运行环境　　getIsWxClient才能　　使才能用方式: 　　apitool.getIsWxClient才能({成功,失败}) 　　备才能注: 　　成才能功或者失败都会调用对应的回调,但是这里只判断了MicroMessenger是否存在,无法得知当前是微信小程序在用还是微信内打开网页,所以如果你是直接从公众号迁移,要保证公众号功能都正常使用的话,这边还得做个判断 ,,将路由参数转换成字符串　　createRouterParams才能　　使才能用方式: 　　String 才能apitool.createRouterParams (obj) ,,跳转到小程序其他原生页面　　jumpRouter才能　　使才能用方式: 　　apitool.jumpRouter才能(routerName:字符串,routerParams:对象) 　　备才能注: 　　请才能看上面注意中写的介绍 ,,跳转小程序原生页面　　jumpNativeRouter才能　　使才能用方式: 　　apitool.jumpNativeRouter才能(routerName:字符串,routerParams:对象) 　　备才能注: 　　这才能个可以用来跳转分享,支付,登录等小程序页面下面的原生页面 ,,跳转原生登录页面　　jumpLogin才能　　使才能用方式: 　　apitool.jumpLogin才能() ,,从webview发起请求到小程序　　postMessage才能　　使才能用方式: 　　apitool.postMessage才能({类型:& # 39;xxx # 39;,数据:{}}) 　　备才能注: 　　具才能体详情请看后面介绍 ,,返回页面　　backRouter才能　　使才能用方式: 　　apitool.backRouter才能() ,,跳转选项卡　　jumpTab才能　　使才能用方式: 　　apitool.jumpTab才能(tabName: String | |, & # 39;回家# 39;)