剪贴板事件的使用

在开发中我们经常会遇到给用户一个激活码，然后让用户复制粘贴的情况，这时候就需要用到clipboard模块，也就是我们的剪贴板模块。

复制激活码功能实现

现在要作一个激活码，然后旁边放一个按钮，点击按钮就可以复制这个激活码，你可以把激活码复制到任何地方。

先新建一个页面index8.html,然后在里边先写相关的html代码。再里边放入一个文字的激活码，然后放入一个按钮。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <div>
        激活码：<span id="code">CreatorRaycomd1asd5w4d3sa1d</span> 
        <button id="myBtn">复制激活码</button>
    </div>
</body>
</html>

然后编写<script>标签，首先分本获取<span>标签的DOM，然后再获取<button>的DOM,然后点击button时，触发事件，把内容复制到剪贴板中。代码如下：

<script>
    const {clipboard} = require('electron');
    const code = document.querySelector('#code');
    const myBtn = document.querySelector('#myBtn');

    myBtn.onclick = () => {
        clipboard.writeText(code.innerHTML);
        alert('复制成功');
    }

</script>

这时候就可以进行预览了，如果提示你的require没找到，记得在main.js中加入这句话。

mainWindow = new BrowserWindow({
    width:800,
    height:600,
    webPreferences:{ nodeIntegration:true}
})

这个在前面讲过，这个就是允许你在`Electron`中使用`node`，现在就应该可以了。

拼写检查器

自 Electron 8 以来已内置支持 Chromium 拼写检查器。在Windows和Linux上，它由拼写词典提供支持，在macOS上，它使用本机拼写检查器API。

如何启用拼写检查器

对于Electron 9及以上, 默认启用拼写检查器. 对于Electron 8，您需要在webPreferences中启用它。

const myWindow = new BrowserWindow({
webPreferences: {
spellcheck: true
 }
})

如何设置拼写检查器使用的语言

在macOS上，当我们使用本机API时，无法设置拼写检查器使用的语言. 默认情况下，macOS 本机拼写检查器会自动检测您使用的语言。

对于 Windows 和 Linux，你应该使用一些 Electron API 来设置拼写检查器的语言。

// 将拼写检查器设置为检查英语、美国和法语
myWindow.session.setSpellCheckerLanguages(['en-US', 'fr'])

// 所有可用语言代码的数组
const possibleLanguages = myWindow.session.availableSpellCheckerLanguages

默认情况下，拼写检查器将启用与当前操作系统区域设置匹配的语言。

如何将拼写检查结果放入上下文菜单

生成上下文菜单所需的所有信息都在每个WebContents实例的context-menu提供。下面提供了一个小的示例，如何用此信息制作上下文菜单。

const { Menu, MenuItem } = require('electron')

myWindow.webContents.on('context-menu', (event, params) => {
  const menu = new Menu()

  // Add each spelling suggestion
  for (const suggestion of params.dictionarySuggestions) {
    menu.append(new MenuItem({
      label: suggestion,
      click: () => mainWindow.webContents.replaceMisspelling(suggestion)
    }))
  }

  // Allow users to add the misspelled word to the dictionary
  if (params.misspelledWord) {
    menu.append(
      new MenuItem({
        label: 'Add to dictionary',
        click: () => mainWindow.webContents.session.addWordToSpellCheckerDictionary(params.misspelledWord)
      })
    )
  }

  menu.popup()
})

拼写检查器是否使用任何谷歌服务

虽然拼写检查器本身没有发送任何输入，单词或用户输入到谷歌服务中，hunspell 字典文件默认从谷歌 CDN 下载。如果你想要避免这种情况，你可以提供一个替代 URL 来下载字典。

myWindow.session.setSpellCheckerDictionaryDownloadURL('https://example.com/dictionaries/')

使用Web前端技术开发桌面应用---Electron剪贴板事件的使用和拼写检查器