Next.js 参考错误：未使用nextjs定义导航器

我的代码如下：

从“React”导入React，{useffect}

import alanBtn from '@alan-ai/alan-sdk-web';

const alanKey = my key;
const App = () => {
    useEffect(() => {
        alanBtn({
            key: alanKey,
            onCommand: ({ command }) => {
                    alert('This code was executed');
            }
        })
    }, []);
    return (
        <div><h1>Alan AI News Application</h1></div>);
}
export default App;

从“@alan ai/alan sdk web”导入alanBtn；
const alanKey=我的钥匙；
常量应用=（）=>{
useffect（（）=>{
阿兰BTN({
键：alanKey，
onCommand:（{command}）=>{
警报（“此代码已执行”）；
}
})
}, []);
返回(
艾伦·艾未未（新闻应用程序）；
}
导出默认应用程序；

但我得到的错误是： 引用错误：未定义导航器。。

---

如何修复它？

这不是你的Next.js代码的问题，这只是你应该调用alan ai库的方式

下面是适合您的解决方案

import React, { useEffect } from "react";

const alanKey = "my key";
function App() {
useEffect(() => {
   const alanBtn = require("@alan-ai/alan-sdk-web");
   alanBtn({
   key: "myKey",
   rootEl: document.getElementById("alan-btn")
  });
}, []);

return (
 <div>
  <h1>Alan AI News Application</h1>
 </div>
 );
}
export default App;

import React，{useffect}来自“React”；
const alanKey=“我的钥匙”；
函数App（）{
useffect（（）=>{
const alanBtn=require（@alan ai/alan sdk web”）；
阿兰BTN({
钥匙：“我的钥匙”，
rootEl:document.getElementById（“alan btn”）
});
}, []);
返回(
Alan AI新闻应用程序
);
}
导出默认应用程序；

这里是同样的讨论链接

希望这能解决你的问题

---

快乐编码。

浏览器对象，如

窗口

，

导航器

等，在使用前应先在

useffect

中定义

  const [pageURL, setPageURL] = useState("");
  const [isNativeShare, setNativeShare] = useState(false);
  useEffect(() => {
    setPageURL(window.location.href);
    if (navigator.share) {
      setNativeShare(true);
    }
  }, []);

// Now, use can use pageURL , isNativeShare in code

---

你能解释一下原因吗。