如何将此代码从v3#转换为v4#？
如何将此代码从v3#转换为v4#？
提问于 2019-05-22 23:33:21
我在sdk4版本的stackoverflow中发现了这个很棒的代码，但是这个版本已经更新到stackoverflow版本了。有人知道如何升级吗？
我尝试了一些东西，但给了我一些错误，主要是在标题
我在git中找到了一些示例，但在其中我需要使用react。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script src="https://cdn.botframework.com/botframework-webchat/latest/botchat.js"></script>
<link href="https://cdn.botframework.com/botframework-webchat/latest/botchat.css" rel="stylesheet" />
<script src="https://cdn.botframework.com/botframework-webchat/latest/webchat.js"></script>
<style>
#mychat {
margin: 10px;
position: fixed;
bottom: 30px;
right: 10px;
z-index: 1000000;
}
</style>
</head>
</html>
<script>
(function () {
var div = document.createElement("div");
document.getElementsByTagName('body')[0].appendChild(div);
div.outerHTML = "<div id='botDiv' style='width: 400px; height: 0px; margin:10px; position: fixed; bottom: 0; right:0; z-index: 1000;><div id='botTitleBar' style='height: 40px; width: 400px; position:fixed; cursor: pointer;'></div></div>";
BotChat.App({ // change to window.WebChat.renderWebChat
directLine: { secret: 'myAppSecret' },
userID: 'YOUR_USER_ID',
}, document.getElementById("botDiv"));
document.getElementsByClassName("wc-header")[0].setAttribute("id", "chatbotheader");
document.querySelector('body').addEventListener('click', function (e) {
e.target.matches = e.target.matches || e.target.msMatchesSelector;
if (e.target.matches('#chatbotheader')) {
var botDiv = document.querySelector('#botDiv');
botDiv.style.height = "0px";
document.getElementById("mychat").style.display = "block";
};
});
document.getElementById("mychat").addEventListener("click", function (e) {
document.getElementById("botDiv").style.height = '500px';
e.target.style.display = "none";
})
}());
</script>回答 1
Stack Overflow用户
回答已采纳
发布于 2019-05-23 01:31:54
看一下代码，我建议您看一下这个Minimizable Web Chat Sample。它有点复杂，因为它是用React编写的，但却完成了你想要做的事情。
如果您仍然对将问题中的代码移植到Web Chat感兴趣，我建议您查看Web Chat的自述文件中的Migrating from Web Chat v3 to v4部分。
或者，你可以添加Facebook Messenger作为你的机器人的频道，并在你的网站上使用他们的Chat Plugin。
希望这能有所帮助。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/56260382
复制相关文章
相似问题
腾讯云开发者
