真实的国产乱ⅩXXX66竹夫人,五月香六月婷婷激情综合,亚洲日本VA一区二区三区,亚洲精品一区二区三区麻豆

成都創(chuàng)新互聯(lián)網(wǎng)站制作重慶分公司

GoWails框架構(gòu)的安裝和使用

這篇文章將為大家詳細講解有關(guān)Go Wails框架構(gòu)的安裝和使用,文章內(nèi)容質(zhì)量較高,因此小編分享給大家做個參考,希望大家閱讀完這篇文章后對相關(guān)知識有一定的了解。

創(chuàng)新互聯(lián)建站,為您提供網(wǎng)站建設(shè)公司、網(wǎng)站制作、網(wǎng)站營銷推廣、網(wǎng)站開發(fā)設(shè)計,對服務(wù)成都被動防護網(wǎng)等多個行業(yè)擁有豐富的網(wǎng)站建設(shè)及推廣經(jīng)驗。創(chuàng)新互聯(lián)建站網(wǎng)站建設(shè)公司成立于2013年,提供專業(yè)網(wǎng)站制作報價服務(wù),我們深知市場的競爭激烈,認真對待每位客戶,為客戶提供賞心悅目的作品。 與客戶共同發(fā)展進步,是我們永遠的責任!

眾所周知,Go 主要用于構(gòu)建 API、web 后端和 CLI 工具。但有趣的是,Go 可以用在我們沒有預(yù)料到的地方。

例如,我們可以使用 Wails 框架用 Go 和 Vue.js 構(gòu)建一個桌面應(yīng)用程序。

這是一個新框架,還在測試階段,但我很驚訝,用它可以很容易的開發(fā),建立應(yīng)用程序。

Wails 提供了將 Go 代碼和 web 前端打包成單一二進制文件的能力。Wails CLI 通過處理項目創(chuàng)建、編譯和打包,使您可以輕松地完成這項工作。

應(yīng)用程序

我們將構(gòu)建一個非常簡單的應(yīng)用程序來實時顯示我的機器的 CPU 使用情況。如果你有時間,喜歡 Wails,你可以想出一些更有創(chuàng)意和更復(fù)雜的東西。

安裝

Wails CLI 可以使用 go get 安裝。安裝之后,你應(yīng)該使用 wails setup 命令進行設(shè)置。

go get github.com/wailsapp/wails/cmd/wails
wails setup

然后讓我們用 cpustats 來啟動我們的項目:

wails init
cd cpustats

我們的項目包括 Go 后端和 Vue.js 前端。main.go 將是我們的入口點,我們可以在其中包含任何其他依賴項,還有 go.mod 文件來管理它們。frontend 文件夾包含 Vue.js 組件,webpack 和 CSS。

概念

有兩個主要組件用于在后端和前端之間共享數(shù)據(jù):綁定和事件。

綁定是一個單一的方法,它允許你向前端公開(綁定)你的 Go 代碼。

此外,Wails 還提供了一個統(tǒng)一的事件系統(tǒng),類似于 Javascript 的本地事件系統(tǒng)。這意味著從 Go 或 Javascript 發(fā)送的任何事件都可以由任何一方接收。數(shù)據(jù)可以隨任何事件一起傳遞。這允許你做一些優(yōu)雅的事情,比如讓后臺進程在 Go 中運行,并通知前端任何更新。

后端

讓我們先開發(fā)一個后端部分,獲取 CPU 使用情況,然后使用 bind 方法將其發(fā)送到前端。

我們將創(chuàng)建一個新的包,并定義一個類型,我將公開(綁定)到前端。

pkg/sys/sys.go:

package sys

import (
    "math"
    "time"

    "github.com/shirou/gopsutil/cpu"
    "github.com/wailsapp/wails"
)

// Stats .
type Stats struct {
    log *wails.CustomLogger
}

// CPUUsage .
type CPUUsage struct {
    Average int `json:"avg"`
}

// WailsInit .
func (s *Stats) WailsInit(runtime *wails.Runtime) error {
    s.log = runtime.Log.New("Stats")
    return nil
}

// GetCPUUsage .
func (s *Stats) GetCPUUsage() *CPUUsage {
    percent, err := cpu.Percent(1*time.Second, false)
    if err != nil {
        s.log.Errorf("unable to get cpu stats: %s", err.Error())
        return nil
    }

    return &CPUUsage{
        Average: int(math.Round(percent[0])),
    }
}

如果你的結(jié)構(gòu)體有一個 WailsInit 方法,Wails 將在啟動時調(diào)用它。這允許您在主應(yīng)用程序啟動之前進行一些初始化。

main.go 中引入 sys 這個包,綁定 Stats 實例返回給前端:

package main

import (
    "github.com/leaanthony/mewn"
    "github.com/plutov/packagemain/cpustats/pkg/sys"
    "github.com/wailsapp/wails"
)

func main() {
    js := mewn.String("./frontend/dist/app.js")
    css := mewn.String("./frontend/dist/app.css")

    stats := &sys.Stats{}

    app := wails.CreateApp(&wails.AppConfig{
        Width:  512,
        Height: 512,
        Title:  "CPU Usage",
        JS:     js,
        CSS:    css,
        Colour: "#131313",
    })
    app.Bind(stats)
    app.Run()
}

前端

我們從 Go 綁定了 stats 實例,它可以在前端被 window.backend.Stats 調(diào)用。如果我們想調(diào)用 GetCPUUsage() 函數(shù) ,它會給我們返回一個應(yīng)答。

window.backend.Stats.GetCPUUsage().then(cpu_usage => {
    console.log(cpu_usage);
})

要將整個項目構(gòu)建成單一的二進制文件,我們應(yīng)該運行 wails build,可以添加 -d 標志來構(gòu)建一個可調(diào)試的版本。它將創(chuàng)建一個名稱與項目名稱匹配的二進制文件。

讓我們通過簡單地在屏幕上顯示 CPU 使用值來測試它是否工作。

wails build -d
./cpustats

事件

我們使用綁定將 CPU 使用值發(fā)送到前端,現(xiàn)在讓我們嘗試不同的方法,讓我們在后臺創(chuàng)建一個計時器,它將使用事件方法在后臺發(fā)送 CPU 使用值。然后我們可以訂閱 Javascript 中的事件。

在 Go 中,我們可以在 WailsInit 函數(shù)中實現(xiàn):

func (s *Stats) WailsInit(runtime *wails.Runtime) error {
    s.log = runtime.Log.New("Stats")

    go func() {
        for {
            runtime.Events.Emit("cpu_usage", s.GetCPUUsage())
            time.Sleep(1 * time.Second)
        }
    }()

    return nil
}

在 Vue.js 中,我們可以在組件掛載(或任何其他地方)時訂閱此事件:

mounted: function() {
    wails.events.on("cpu_usage", cpu_usage => {
        if (cpu_usage) {
            console.log(cpu_usage.avg);
        }
    });
}

測量條

如果使用一個測量條來顯示 CPU 的使用情況就好了,因此我們將包含一個第三方依賴項,只需使用 npm 即可:

npm install --save apexcharts
npm install --save vue-apexcharts

然后導(dǎo)入 main.js 文件:

import VueApexCharts from 'vue-apexcharts'

Vue.use(VueApexCharts)
Vue.component('apexchart', VueApexCharts)

現(xiàn)在,我們可以使用 apexcharts 顯示 CPU 使用情況,并通過從后端接收事件來更新組件的值:



要更改樣式,我們可以直接修改 src/assets/css/main,或者在組件中定義它們。

最后,構(gòu)建并運行

wails build -d
./cpustats

Go Wails框架構(gòu)的安裝和使用

關(guān)于Go Wails框架構(gòu)的安裝和使用就分享到這里了,希望以上內(nèi)容可以對大家有一定的幫助,可以學(xué)到更多知識。如果覺得文章不錯,可以把它分享出去讓更多的人看到。


網(wǎng)頁名稱:GoWails框架構(gòu)的安裝和使用
本文鏈接:http://weahome.cn/article/goggpe.html

其他資訊

在線咨詢

微信咨詢

電話咨詢

028-86922220(工作日)

18980820575(7×24)

提交需求

返回頂部