嘿开发者！
在本文中，您将了解 tawk.to 及其与 NEXTjs 的集成。
关于TAWK.to:
Tawk.to 是一款免费的基于云的实时聊天软件，使企业能够与网站访问者实时交互。它提供聊天监控、自动触发以及与各种平台集成等功能。 Tawk.to 因其易用性、定制选项和经济实惠而广受欢迎。
与Nextjs集成的步骤
您可以从 tawk.to 文档获取帮助 https://help.tawk.to/article/react-js.
否则请按照以下步骤操作：
1- 将库安装到您的 Nextjs 应用程序
纱线添加@tawk.to/tawk-messenger-react
2- 前往 https://help.tawk.to/ 并注册
3- 创建您的小部件/项目并转到仪表板
4-现在在 nextjs 应用程序的 page.js 文件中导入 tawk-messenger-react。然后，为您的 widgetId 和 propertyId 分配值。使用 API 时，您需要使用 useRef 来访问 tawk-messenger-react 组件中的对象函数。
5- 转到 tawk.to 上的项目仪表板以获取 ids：
下面的例子中，属性ID为xxxxxxxxxxxxxxxxxxxxxxxx，widgetId为123456789。
6- 现在在 page.js 中：
`“使用客户端”
从 '@tawk.to/tawk-messenger-react' 导入 TawkMessengerReact;
从“../stores/userStore”导入 useUserStore;
从“react”导入{useRef};
导出默认功能页面({children}) {
const tawkMessengerRef = useRef();
const {userData } = useUserStore();
const handleMinimize = () =>; {
tawkMessengerRef.current.minimize();
};
const onTawkLoad = () =>; {
console.log("Tawk.to 小部件已加载");
};
返回（
onLoad={onTawkLoad} 这定义了从您的应用程序发送到 tawk.to 的内容，例如访客/用户信息。
根据您的项目需求更新代码！
谢谢
以上是TAWK.TO 和 NEXTjs 集成的详细内容。更多信息请关注PHP中文网其他相关文章！
