我正在制作 react 应用程序,它应该在多个监视器上运行。默认情况下 npm start 运行 index.js 脚本并渲染的“根”组件。但是,我需要在 npm 启动时打开不同的窗口/选项卡(windows1、window2、window3 具有不同的内容)。有没有办法实现它?
任何帮助,将不胜感激。
回答1
我使用并发和等待解决了这个问题。 package.json 内部:
"sidetask":"wait-on http://localhost:3000 && node src/sidetask.js",
"start-all": "concurrently \"npm run sidetask\" \"npm start\""
回答2
运行 npm 时自动打开浏览器仅适用于您的本地计算机。人们将通过访问应用程序所在服务器的 URL 来访问应用程序。
您可以使用 window.open
打开选项卡。
如果您想在页面加载时自动打开选项卡,您可以将其包装在 useEffect 调用中,并根据应用程序的设置将其放置在合适的位置。它看起来像这样:
[tabsOpened, setTabsOpened] = useState(false)
useEffect(() => {
if (!window || tabsOpened) return null;
window.open("http://example.com", "_blank");
window.open("http://example1.com", "_blank");
window.open("http://example2.com", "_blank");
// etc...
setTabsOpened(true)
}, [window])
请注意,某些浏览器/插件可能会阻止您打开多个选项卡。我刚刚做了一个测试,它似乎在 Safari 中有效,但在 Chrome 中无效。
如果您想指定每个窗口在哪个监视器上打开,事情会变得更复杂一些。但是这个问题似乎是一个很好的起点:https://stackoverflow.com/questions/16363474/window-open-on-a-multi-monitor-dual-monitor-system-where-does-window-pop-up