使用Electron制作一个快速搜索应用（入门向）

最新推荐文章于 2024-05-16 14:18:19 发布
最新推荐文章于 2024-05-16 14:18:19 发布
阅读量568 收藏
点赞数
分类专栏： javascript 文章标签： Electron nodejs
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/wadejs/article/details/84558580
版权

什么是Electron

Electron是由Github开发，用HTML，CSS和JavaScript来构建跨平台桌面应用程序的一个开源库。 Electron通过将Chromium和Node.js合并到同一个运行时环境中，并将其打包为Mac，Windows和Linux系统下的应用来实现这一目的。

由于平常去不同的站点搜索进行代码搬运时要经常切换不同的网站再进行搜索，本来想做一个整合搜索的站点方便自己平常搜索用；后来看到vscode忽然觉得可以使用它的爸爸——Electron来做一个试试，顺便练练手入门一下Electron，而且还可以使用快捷键呼出窗口来搜索，比用网站做更快。

想做的功能有：

  1. 平常隐藏在系统托盘，使用时用快捷键Alt+ s呼出搜索窗口
  2. 可以拖动搜索按钮，调整顺序
  3. 可以自定义搜索站点，增加删除修改
  4. 可设置开机启动

项目地址
可以下载DEMO玩玩，直接解压缩就可以了demo.zip

应用GIF

Alt + s 呼出窗口,点击选择搜索目标网站

最低0.47元/天 解锁文章
wadejs
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Electron使用指南——搜索信息
qianfeng_dashuju的博客
09-04 372
搜索信息的思路：在/src/components/Header.vue组件里获取到用户从搜索框里的关键字(keyword)，保存在Store里，再做个getter, 过滤items信息，修改Main.vue组件的渲染信息源。 1、定制 Store 修改src/store/modules/main.js： // ... const state = { // ... keywords: '' } const mutations = { // ... chang...
electron 读取文件夹内容_electron + jQuery +node.js 快速上手之实现写入文件、拖拽打开文件并读取内容的功能...
weixin_39608680的博客
12-22 420
导言近来对electron有点感兴趣，奈何干啃官方文档实在难受，还是直接从demo入手会比较好。受到一两个教程的启发，然后自己瞎捣鼓一下。说明利用Electron.js构建一个有以下功能的桌面端应用：实现简单的获取文本框输入的内容并保存为文件能够通过拖拽文件来读取其中的信息应用界面因为只是demo ，为了方面，就只是加基础样式了，将就着看。应用界面.png输入文字.png结果.png拖拽文件.pn...
Electron使用指南——16搜索信息_electron内存搜索(2)
最新发布
2401_84545804的博客
05-16 268
本人从事网路安全工作12年，曾在2个大厂工作过，安全服务、售后服务、售前、攻防比赛、安全讲师、销售经理等职位都做过，对这个行业了解比较全面。最近遍览了各种网络安全类的文章，内容参差不齐，其中不伐有大佬倾力教学，也有各种不良机构浑水摸鱼，在收到几条私信，发现大家对一套完整的系统的网络安全从学习路线到学习资料，甚至是工具有着不小的需求。最后，我将这部分内容融会贯通成了一套282G的网络安全资料包，所有类目条理清晰，知识点层层递进，需要的小伙伴可以点击下方小卡片领取哦！
Electron使用指南 - [16] 搜索信息
sdasadasds的博客
12-07 206
搜索信息的思路：在 /src/components/Header.vue 组件里获取到用户从搜索框里的关键字(keyword)，保存在 Store 里，再做个 getter , 过滤 items 信息，修改 Main.vue 组件的渲染信息源。 1、定制 Store 修改 src/store/modules/main.js： // ... const state = { // ... keywords: '' } const mutations = { // ... changeKey
electron-find:查找网页中文本的所有匹配项
05-05
电子发现 English | 介绍 在电子应用程序中查找文本的所有匹配项 特征 取决于电子的findInPage的API 支持find界面的用户配置界面 支持区分大小写 用户输入更改时自动查找 查找界面与电子视图分开 支持电子版本^ 1.8.0，^ 2.0.0，^ 3.0.0，^ 4.0.0 Windows，Linux，Mac的支持平台 演示版 预设使用者介面 自定义用户界面 安装 $ npm install electron-find --save 用法 # import module import { remote, ipcRenderer } from 'electron' import { FindInPage } from 'electron-find' # create instance of FindInPage with default config let fin
electron 获取PC电脑所有安装的软件
ajiejie66的博客
09-05 1702
electron 获取PC电脑所有安装的软件。
用 Electron 打造 Win/Mac 应用，从「代码」到可下载的「安装包」，可能比你想得麻烦一点...
weixin_34119545的博客
11-08 651
2019独角兽企业重金招聘Python工程师标准>>> ...
使用electron来创建属于自己的utools
weixin_44415775的博客
04-02 300
快捷键呼出隐藏界面进行数据查询与密码管理功能的小桌面系统 使用electron来创建属于自己的utools
开源版本的 uTools。可支持 uTools 所有插件生态
nidongla的博客
06-29 1285
话不多说，先放上截图和仓库地址： 代码仓库：github 故事背景网上购物优惠券 www.cqfenfa.com 网络抓包 之前公司内部因为开发需要，需要和后端进行接口联调，测试环境的时候，经常会涉及到一些状态改变要看交互样式的问题。比如测试需要测商品的待支付、支付中、支付完成等各种节点的交互样式是否符合预期，这种情况测试一般会去造数据或者让后端改数据库接口。 有的小伙伴可能会用 Charles 修改返回数据进行测试。但是 Charles 的抓包体验和配置体验感觉有点麻烦，不是很友好，所以我们自己做了个抓.
electron启动其他应用程序
qq_41713136的博客
08-18 3181
electron
Electron 页内查找模块介绍
weixin_34268310的博客
01-15 629
简介 实现Electron app页内按关键字查找匹配文本的功能 特征 依赖于Electron的findInPage API 支持使用者灵活配置UI界面 支持区分大小写 当用户输入时自动查找 查找输入框文本隔离，不会被匹配到 支持以下Electron版本 ^1.8.7, ^2.0.0, ^3.0.0, ^4.0.0 支持以下平台 Windows, Linux, Mac 演示 默认UI 定制化...
electron调起本地应用
范天缘的博客
09-19 3359
**//调用子进程 const exec = require("child_process").exec; exec("你的应用绝对路径", (error, stdout, stderr) => { console.log(JSON.stringify(error, stdout, stderr)); });**
[项目记录]用vue-electron搭建pc网易云音乐程序（3-1）——添加header头部功能
iufesjgc的博客
05-31 700
头部从左到右依次为： 前进后退功能、搜索功能、听歌识曲、登录及查看个人信息、换肤、设置、消息、迷你模式，最小化最大化和关闭。 1、前进后退功能： 一开始我以为这个功能很简单的，只需要获取历史路径记录就可以了，用window.history，但有一个问题，它记录的是所有的历史记录，也就是说哪怕后退，他也会记录进去，在window.history.length里直接加一，这样就没法判断起始页了。咨询了几个大佬，大佬说这个功能要自己写，细问之后有了大致思路。 首先在data里定义好routehisto..
解决Electron窗口通过require引入js无效的问题
irokay的专栏
07-07 2458
已为窗口配置参数： webPreferences: { nodeIntegration: true } 按道理已为页面集成Node.js环境，并赋予了html页面中的JavaScript访问Node.js环境的能力。但当在html中script标签中通过require引入js后，却未生效。 经过多处查找，终于解决问题，需对以上配置新增配置参数：contextIsolation，即： webPreferences: { nodeIntegration: true , contextIsolatio
element UI 制作模糊搜索框
马优晨
12-13 6534
如图所示，当你输入某个关键字时，去掉用某个接口，然后通过关键字获取数据。 View Code <el-autocomplete class="inline-input" v-model="form.tName" :fetch-suggestions="querySearch" pl
针对答题的一款快速搜索工具 android
clxcxx的专栏
01-12 1456
现在答题是真火，到处撒币，家家撒币，闲着咱也跟风，出一个安卓的快速搜索神器，答题神队友（到底是不是神队友，只有试试才知道，），方便捡币的玩家捡币，哈哈。 原理是比较简单的，利用科大讯飞的语音识别技术，返回用户搜索的关键词文件，用jsoup请求搜索，解析用户搜索的关键词，给出最近的前20条结果摘要。然后展示出来，在用户点击某一项时，可以跳到详情页。 感兴趣的去试试吧 下载地址：https://
win快速搜索软件
weixin_30413739的博客
07-27 265
Everything 与其他搜索工具的简单比较： Everything是至今为止 X-Force 所使用过速度最快的文件搜索工具。与它相似的有异次元曾经介绍过一款很老的软件AVAFind，也非常的优秀，遗憾的是它在2003年就停止了开发，并且AVAFind是一款收费软件。和AVAFind一样，Everything 也是基于文件名索引的文件搜索引擎，Everything 不需一分钟便完成了我的整...
使用vue和electron做一个桌面社交应用
04-05
使用Vue和Electron创建桌面社交应用程序是一个有趣的项目，可以学习到如何使用两个流行的技术来创建跨平台的应用程序。在该项目中，需要学习如何集成Vue和Electron，并使用ipcMain和ipcRenderer来处理主进程和渲染...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值