[英]External JS in Vue.js
我正在嘗試設置自定義聊天,它期望這樣的事情:
<script>
window.fcSettings = {
token: "737838-363673273278-782828",
host: "https://wchat.freshchat.com",
externalId: "john.doe1987", // user’s id unique to your system
firstName: "John", // user’s first name
lastName: "Doe", // user’s last name
email: "john.doe@gmail.com", // user’s email address
phone: "8668323090", // phone number without country code
phoneCountryCode: "+1" // phone’s country code
};
</script>
<script src="https://wchat.freshchat.com/js/widget.js" async></script>
我創建了一個簡單的vue組件,並在created()下具有以下功能:
updateChat() {
axios.get('/api/user-info')
.then((resp) => {
const user = resp.data
window.fcSettings = {
token: "737838-363673273278-782828",
host: "https://wchat.freshchat.com",
externalId: user['id'],
firstName: user['name'],
lastName: user['surname'],
email: user['email'],
};
})
.catch((err) => {alert(err); console.log(err);})
},
但是我不確定在此函數運行后如何加載https://wchat.freshchat.com/js/widget.js
。 我嘗試將其作為我的bundle.js標簽下的常規標簽進行廣告投放,但沒有成功。 我該怎么做? 謝謝。
一個非常糟糕的方法是將它異步地作為文本加載並使用eval()
...但是,為什么要先加載它,然后將其包裝到函數中,然后再調用它呢?
在您的index.html文件中,將以下代碼添加到該部分
<script src="https://wchat.freshchat.com/js/widget.js"></script>
然后在main.js文件中,添加以下代碼:
mounted() {
axios.get('/api/user-info')
.then((resp) => {
const user = resp.data
window.fcWidget.init({
token: "737838-363673273278-782828",
host: "https://wchat.freshchat.com",
externalId: user['id'],
firstName: user['name'],
lastName: user['surname'],
email: user['email'],
});
})
.catch((err) => {alert(err); console.log(err);})
}
}
});
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.