嗨,我是Microsoft Bot Framework的新手,请原谅我的问题。
我想更改聊天机器人的样式,但遇到一个问题,即我无法通过styleSet禁用上载按钮。
const styleOptions = {
hideUploadButton: true,
bubbleBackground: "red",
bubbleBorderStyle: "solid",
bubbleBorderRadius: "10px",
bubbleFromUserBackground: "#5ce9ff",
bubbleFromUserBorderRadius: "10px",
groupTimeStamp: 3000,
emojiSet: true,
timestampFormat: 'relative',
timestampColor: "red",
};
上面的代码可以正常工作,但是当我尝试更改聊天机器人的背景图像时,我认为我需要通过styleSet传递styleOptions,尽管我将其设置为true,但在这里其他所有东西都可以正常工作,而不是上载按钮。
const styleOptions = {
hideUploadButton: true,
bubbleBackground: "red",
bubbleBorderStyle: "solid",
bubbleBorderRadius: "10px",
bubbleFromUserBackground: "#5ce9ff",
bubbleFromUserBorderRadius: "10px",
groupTimeStamp: 3000,
emojiSet: true,
timestampFormat: 'relative',
timestampColor: "red",
};
const styleSet = createStyleSet({
...styleOptions,
});
styleSet.activities = {
...styleSet.activities,
backgroundImage:
"url('https://i.pinimg.com/originals/79/5c/ab/795cabc4647f73b365e2e6eabd0f34dc.png')",
};
// render webchat
function renderWebChat(token, userId, enableWSS) {
console.log("starting webchat");
window.WebChat.renderWebChat(
{
directLine: window.WebChat.createDirectLine({
token: token,
// domain: '//' + window.location.host,
domain:
"https://bot-web-connector-dot-anna-dev-bot-services.df.r.appspot.com",
webSocket: !!enableWSS,
}),
styleSet,
store: store,
userID: userId,
username: "You",
locale: navigator.language || "en-SG",
},
document.getElementById("webchat")
);
}
我不确定为什么当我以这种方式实现我的代码时无法解决问题,任何人都可以对我的错误提出建议。
似乎目前存在一个小错误styleOptions
。同时,你可以执行以下操作来隐藏上传按钮。
styleSet.uploadButton = {
...styleSet.uploadButton,
display:
"none",
};
希望有帮助!
感谢您的帮助,对我来说效果很好。我实际上是通过尝试通过将整个styleOptions传递到styleSet下面的renderWebChat()中来实现的,它也可以工作。尽管如此,还是感谢您的大力帮助!