1 Star 0 Fork 16

AnnOS / coinboard

forked from sharpcx / coinboard 
加入 Gitee
与超过 1200万 开发者一起发现、参与优秀开源项目,私有仓库也完全免费 :)
免费加入
该仓库未声明开源许可证文件(LICENSE),使用请关注具体项目描述及其代码上游依赖。
克隆/下载
贡献代码
同步代码
取消
提示: 由于 Git 不支持空文件夾,创建文件夹后会生成空的 .keep 文件
Loading...
README

跨平台自定义实时行情看板

前言

前段时间跟朋友炒币,总是需要打开交易平台才能看行情和炒币,有点麻烦,而且那个窗口也特别大,内容也很杂,所以跟我说能不能搞个跨平台的可以自己定制的行情看板。

主要工具

  • electron
  • vue
  • element-ui
  • aicoin

安装electron和vue

这个教程比较多,不过不用自己做,有这种template,参考链接,建议使用cnpm快一些尤其是electron如果用npm特别慢。

# Install vue-cli and scaffold boilerplate
npm install -g vue-cli
vue init simulatedgreg/electron-vue my-project

# Install dependencies and run your app
cd my-project
yarn # or npm install
yarn run dev # or npm run dev

项目结构

主要文件说明

  • MainPage用来配置要显示的货币类型
  • ShowPage是看板页面
  • aicoin是下载到本地的aicoin脚本,因为要翻墙所以先下好
  • showcoin是具体显示数据的脚本。

遇到的问题和说明

  1. 如何在vue中导入非npm js脚本 由于aicoin脚本为普通js脚本不能直接import所以这里使用动态 html tag的方式来导入,有两个小问题点1.如何导入,2.如何控制导入顺序

    如何导入

      let loadScript = function(url, callback) {
      var script = document.createElement("script");
      script.type = "text/javascript";
    
      if (script.readyState) {
        //IE
        script.onreadystatechange = function() {
          if (
            script.readyState == "loaded" ||
            script.readyState == "complete"
          ) {
            script.onreadystatechange = null;
            callback();
          }
        };
      } else {
        //Others
        script.onload = function() {
          callback();
        };
      }
    
      script.src = url;
      document.getElementsByTagName("head")[0].appendChild(script);
    };

    如何控制导入顺序

        loadScript("./static/aicoin.js", function() {
          loadScript("./static/showcoin.js", function() {});
        });
  2. vue如何调用electronAPI

electron分主线程和展示线程通过ipc进行通信
注册事件

ipcMain.on('resizeWindow', (event, arg) => {
  mainWindow.setSize(arg.width, arg.height)
})

触发

ipcRenderer.send("resizeWindow",  {width:1000, height:(dataitems.length+2)*34+38+30});

跨平台打包

#  mac 
npm run build:mac
# win
npm run build:win

使用方法

npm run dev 然后去aicoin选择自己想看的币和平台,然后粘贴右面币列表代码

点击立即创建

代码地址

空文件

简介

跨平台自定义实时行情看板 展开 收起
JavaScript
取消

发行版

暂无发行版

贡献者

全部

近期动态

加载更多
不能加载更多了
JavaScript
1
https://gitee.com/AnnOS/coinboard.git
git@gitee.com:AnnOS/coinboard.git
AnnOS
coinboard
coinboard
master

搜索帮助

14c37bed 8189591 565d56ea 8189591