uniapp实现非h5程序时,script如何调用外部链接
需要使用renderjs区分逻辑层和视图层
<template>
//通过监听 实现逻辑层 向视图层传值
//:change:userData="agent.getUserData" userData:逻辑层的值传给视图层 agent:视图层的module getUserData:视图层监听逻辑层的方法
<view :userData="userData" :change:userData="agent.getUserData"></view>
</template>
<script lang="renderjs" module="agent">
export default {
data() {
return {
userInfo:{}, cozeWebSDK: null,
}
},
async mounted(){
await this.loadScript('https://xxx/index.js') //外部的js链接
this.agentJs() // 自动显示聊天框
setTimeout(() => { const ta = document.querySelector('textarea'); if (ta) ta.placeholder = '发送消息'; }, 800) },
methods:{
//监听userData 当逻辑层的userData更改,会调用此方法 getUserData(userData){ this.userInfo = userData.userInfo this.AgentConfig.token = userData.token }, cozeJs(){ // 可以写根据src 实现的相关代码 *******
// 调用逻辑层的方法
this.$ownerInstance.callMethod('backTo') }, // 动态加载外部 SDK 脚本 loadScript(src){ return new Promise((resolve, reject) => { if (document.querySelector(`script[src="${src}"]`)) { resolve() return } const script = document.createElement('script') script.src = src script.onload = () => resolve() script.onerror = () => reject(new Error(`无法加载脚本:${src}`)) document.head.appendChild(script) }) }, } } </script> <script> import { getToken } from '@/api/agent/index.js' export default { data(){ return { userData:{}, } }, async mounted() { await this.getToken() }, methods:{ getToken(){ let val = uni.getStorageSync('userInfo') let userInfo = { id:val.userId, avatar_url: "", nickname: val.nickName } getToken().then(res => { if(res.code == 200) {
//更改userData 视图层将会收到userData的值 this.userData = { userInfo:userInfo, token:res.msg } } }) }, backTo(){ uni.navigateBack({ delta: 1 }) } } } </script>
参考:https://blog.csdn.net/qq_41919732/article/details/144747275
https://blog.csdn.net/miqibumiaowu/article/details/141856425