Reactjs 如何在单个页面的JS/electron应用程序中搜索文本

我有一个react electron应用程序，我想在其中添加ctrl+f功能。我添加了一个globalshortcut，它响应ctrl+f并显示一个文本框，然后在文本框上，我为它提供了一个调用window.find（）的更改侦听器。 不幸的是，它从不在页面中搜索，它总是返回false。我假设这与react组件有关，是否有方法搜索并突出显示页面上所有组件的文本

代码：

---

我明白了，觉得自己像个十足的白痴： 在main.js中

mainWindow.webContents.on('found-in-page', (event, result) => {
if (result.finalUpdate) {
  mainWindow.webContents.stopFindInPage('keepSelection');
}
});
ipcMain.on('search-text', (event, arg) => {
  mainWindow.webContents.findInPage(arg);
});

在页面中：

static searchPage(event) {
if (event.target.value.lenght > 0) {
    ipcRenderer.send('search-text', event.target.value);
 }
}

---

我明白了，觉得自己像个十足的白痴： 在main.js中

mainWindow.webContents.on('found-in-page', (event, result) => {
if (result.finalUpdate) {
  mainWindow.webContents.stopFindInPage('keepSelection');
}
});
ipcMain.on('search-text', (event, arg) => {
  mainWindow.webContents.findInPage(arg);
});

在页面中：

static searchPage(event) {
if (event.target.value.lenght > 0) {
    ipcRenderer.send('search-text', event.target.value);
 }
}

---

为了给你一个替代方案，有一些组件为你做这件事，所以你不需要自己构建它。 也有同样的问题，首先通过使用修复，但是这个组件不能在电子2或更大的情况下正常工作

然后终于找到解决我问题的方法。与电子4一起使用

您只需将组件添加到项目中：

npm install electron-find --save

在Electron主进程中添加全局快捷方式，以ctrl+f格式将事件发送到渲染器：

globalShortcut.register('CommandOrControl+F', () => {
    window.webContents.send('on-find');
});

然后您可以将其添加到页面（渲染器进程）

---

希望这会有所帮助。

为了给您提供一个替代方案，有一些组件可以为您执行此操作，因此您不需要自己构建它。 也有同样的问题，首先通过使用修复，但是这个组件不能在电子2或更大的情况下正常工作

然后终于找到解决我问题的方法。与电子4一起使用

您只需将组件添加到项目中：

npm install electron-find --save

在Electron主进程中添加全局快捷方式，以ctrl+f格式将事件发送到渲染器：

globalShortcut.register('CommandOrControl+F', () => {
    window.webContents.send('on-find');
});

然后您可以将其添加到页面（渲染器进程）

---

希望对您有所帮助。

您好，我有一些问题，您可以解释一下，如何使用此功能。我不明白如何将搜索文本发送到

main window.webContents.findInPage

。我写你好，我有你能解释一下，如何使用这个功能。我不明白如何将搜索文本发送到

main window.webContents.findInPage

。我写