加webview的vue相关处写如下加红代码
<script>
const facebook = uni.requireNativePlugin('sn-facebook');
var wv; //计划创建的webview
export default {
data() {
return {
canBack: false
};
},
onLoad() {},
onBackPress() {
if (wv && this.canBack) {
wv.back();
return true;
}
return false;
},
onReady() {
// #ifdef APP-PLUS
var self = this;
var currentWebview = this.$scope.$getAppWebview(); //此对象相当于html5plus里的plus.webview.currentWebview()。在uni-app里vue页面直接使用plus.webview.currentWebview()无效，非v3编译模式使用this.$mp.page.$getAppWebview()
setTimeout(function() {
wv = currentWebview.children()[0];
wv.addEventListener(
'progressChanged',
function(e) {
wv.canBack(function(e) {
self.canBack = e.canBack;
});
},
false
);
}, 500); //如果是页面初始化调用时，需要延时一下
// #endif
},
methods: {
onMessage({ detail }) {
const data = detail.data[0];
console.log('onMessage', data);
if (data.action == 'login') {
// 登录：自定义参数
facebook.loginWithParams(
{
permissions: [
// 权限，更多权限请看 https://developers.facebook.com/docs/permissions/reference
'email',
'public_profile'
],
// 返回字段，更多字段请查看 https://developers.facebook.com/docs/graph-api/reference/user/
fields: 'id, name, email'
},
e => {
console.log(e);
this.postMessage({ ...e, action: 'loginCallback' });
}
);
}
},
// postMessage to web
postMessage(data) {
if (wv) {
wv.evalJS('window.postMessage(' + JSON.stringify(data) + ');');
} else {
uni.showToast({
icon: 'none',
title: 'webview不存在'
});
}
}
}
};
</script>
网友评论