小程序web-view的使用,跳转到外部链接~
先说一下需求,要点击榜单,跳到我们的移动web的项目的榜单页,这个不是小程序的哦,就是网页版的.

榜单的html代码:
<view class="nav" hover-class="none" >
<view class="index" bindtap="fresh">
<image class="navbottomicon" src="{{homeOr?srcactive :src}}" ></image>
<text class="nav-tex" style="color:{{homeOr?srcactivecolor:srccolor}};">放心试</text>
</view>
<view class="index" bindtap="toList" data-url="https://www.fishqc.com/cn/m/report-list#program">
<image class="navbottomicon" src="{{listOr?listactive :list}}"></image>
<text class="nav-tex" style="color:{{listOr?listactivecolor:listcolor}};">榜单</text>
</view>
<view class="index" bindtap="jumpown">
<image style="border-radius: 50%;overflow: hidden;border:1px solid #f6f6f6;box-sizing: border-box;" class="navbottomicon" src="{{islogin ? Headimg :own}}" ></image>
<text class="nav-tex">我的</text>
</view>
</view>
js代码
toList: function (e){
var that = this
// this.setData({
// listOr:true,
// homeOr:false
// })
var listarl = encodeURIComponent(e.currentTarget.dataset.url)
console.log(listarl,'listarl')
// wx.navigateTo({
// url: '../listwebview/listwebview?url=' + listarl
// })
wx.navigateTo({
url: '../webview/webview?url=' + listarl //这里是跳转到新开的webview页面
})
}
webview页面 html代码
<web-view src="{{url}}"></web-view>
webview页面 js代码
var app = getApp()
Page({
data: {
url: '',
},
onLoad: function (options) {
let fromPath=decodeURIComponent(options.url);
this.setData({
url:fromPath
})
}
})
用web-view一定要在小程序的后台去配业务域名,
我当时遇到的情况就是,明明配好了业务域名,还提示

原来是这个我跳进来的榜单页面,之前的业务在里面写了http://www.fishqc.com等代码 .....我改了这个页面改成https就好了,没有改其他的页面,但是其他页面应该是有http的,只要不用到这个页面就不会提示.我当时在想是不是业务域名没有配好,所以拿其他的带有这个域名的其他页面链接试试,是没有问题的,下次有人遇到可以像我这样先确保业务域名是可以用的.
注意保护眼睛,乖~
小程序web-view的使用,跳转到外部链接~的更多相关文章
- 一套代码小程序&Web&Native运行的探索05——snabbdom
接上文:一套代码小程序&Web&Native运行的探索04——数据更新 对应Git代码地址请见:https://github.com/yexiaochai/wxdemo/tree/ma ...
- 一套代码小程序&Web&Native运行的探索04——数据更新
接上文:一套代码小程序&Web&Native运行的探索03 对应Git代码地址请见:https://github.com/yexiaochai/wxdemo/tree/master/m ...
- 一套代码小程序&Web&Native运行的探索02
接上文:一套代码小程序&Web&Native运行的探索01,本文都是一些探索性为目的的研究学习,在最终版输出前,内中的内容可能会有点乱 参考: https://github.com/f ...
- 小程序 web 端实时运行工具
微信小程序 web 端实时运行工具 https://chemzqm.github.io/wept/
- 一套代码小程序&Web&Native运行的探索06——组件系统
接上文:一套代码小程序&Web&Native运行的探索05——snabbdom 对应Git代码地址请见:https://github.com/yexiaochai/wxdemo/tre ...
- 一套代码小程序&Web&Native运行的探索03——处理模板及属性
接上文:一套代码小程序&Web&Native运行的探索02 对应Git代码地址请见:https://github.com/yexiaochai/wxdemo/tree/master/m ...
- 小程序 公众号/h5相互跳转-webview
小程序与h5的跳转 前提小程序管理后台配置域名白名单,并且h5页面是嵌在小程序里面(相互跳的前提条件) 在业务域名中设置好访问的h5地址 微信官方web-view 介绍地址 https://devel ...
- 微信小程序 confirm(删除提示)提示框,询问框,小程序操作成功提示后跳转
微信小程序删除处理 没有 confrim 那怎么实现这个效果呢 可以使用小程序里的模态框 代码: wx.showModal({ title: '提示', content: '确定要删除吗?', suc ...
- 微信小程序从零开始开发步骤(七)引入外部js 文件
上一章讲到小程序页面的四种常见的跳转的方法,这一章写如何引入一个外部的js文件,既utils文件夹的用处,其实步骤很简单: 1:准备好外部想要引入的外部文件,命名为util.js,并且填充固定的文件内 ...
- vue项目跳转到外部链接
vue项目中遇到一个打印的功能.思考之后决定点击按钮,跳转到一个HTML页面(后台写的),利用window.print()方法调用浏览器的打印的功能. 所以,现在的问题是,怎样跳转到外部链接.开发vu ...
随机推荐
- 转:common.js 常用js公共函数库
转自其他博主,自己开发备用 var h = {}; h.get = function (url, data, ok, error) { $.ajax({ url: url, data: data, d ...
- Go part 7 反射,反射类型对象,反射值对象
反射 反射是指在程序运行期间对程序本身进行访问和修改的能力,(程序在编译时,变量被转换为内存地址,变量名不会被编译器写入到可执行部分,在运行程序时,程序无法获取自身的信息) 支持反射的语言可以在程序编 ...
- 数据结构与算法---排序算法(Sort Algorithm)
排序算法的介绍 排序也称排序算法 (Sort Algorithm),排序是将一组数据,依指定的顺序进行排列的过程. 排序的分类 1) 内部排序: 指将需要处理的所有数据都加载 到内部存储器(内存)中进 ...
- H5 新增标签canvas 画布
canvas是写在body中的标签,设置宽高后,通过JS来往其中绘制想要的内容, canvas可以理解为一个画板,而JS就是你的画笔. 1.获取到画布 var canvas = document.ge ...
- Linux Exploit系列之三 Off-By-One 漏洞 (基于栈)
Off-By-One 漏洞 (基于栈) 原文地址:https://bbs.pediy.com/thread-216954.htm 什么是off by one? 将源字符串复制到目标缓冲区可能会导致of ...
- 关于lock和synchronized的选择
这里不介绍具体用法,介绍lock和synchronized的不同从而做出选择 1.lock是一个接口,而synchronized是java中的一个关键字,synchronized是内置的语言实现. 2 ...
- Python面向对象之多态、封装
一.多态 超过一个子类继承父类,出现了多种的形态. 例如,动物种类出现了多种形态,比如猫.狗.猪 class Animal:pass class Cat(Animal):pass class Dog( ...
- CentOS7 安装记录
起因是想自建一个本地笔记云存储,按照网上的教程搭建,卡在了其中的一个步骤上(文章见https://www.laobuluo.com/1542.html),卡在了如下图的位置,google了一番解决的办 ...
- javascript数据判断是否有指定元素
jquery方法: $.inArray(dataKey, dataArray) == -1 javascript方法: indexOf() 功能:根据指定的数据,从左向右,查询在数组中出现的位置,如果 ...
- Eclipse安装zookeeper监控插件
1.在 Eclipse 菜单打开Help -> Install New Software…2.添加 url http://www.massedynamic.org/eclipse/updates ...