81.go + vue实现web应用程序

Python025

81.go + vue实现web应用程序,第1张

前端框架越来越丰富，前后端分离已经是大多数软件团队采取的模式了。vue使用的场景也越来越多。

go本来使用template模板来进行前端的表现，现在可以用vue来分担很大一部分工作了。

通常直接使用go语言写后端，然后使用静态模板加载渲染前端，前端获取后端提供的数据是使用{{ }}符号，2个套在一起的花括号。这个也是vue使用的数据表现方式。

如果go+vue来协同工作的话，需要对vue进行一点设置。比如把{{ }}的方式改为[[ ]]的方式。

首先我们要知道，vue的使用，需要在页面中加载vue.js或vue.min.js

纯静态网页使用vue是这样的（给个html例子）

然后我们实现一个go的简单web服务和模板页面

这个go服务器通过端口 1989 展示服务器页面，提供了一个静态文件路径 htmlpage，我们把vue.js和index.html文件都放置在htmlpage路径里。

go服务器还用模板给前台页面提供了一个News结构的数据，数据包括：Title,Content,Author的值。

在index.html页面中，加载vue.js的时候需要带上静态路径 htmlpage

在 new 一个 vue 变量的时候，必须有一句来设置包裹数据的符号，我们这里设置这个符号为[[ ]]

同时，所有需要由 vue 渲染的数据，都写成类似这样的样子

在 go + vue 方式下的完整模板文件 index.html

此页面中{{ }}包裹的数据是由go从后端提供的数据（ 例如：{{.Title}}），而[[ ]]包裹的数据，是vue渲染的数据。

只是把 Vue里的数据，改为由go后端提供即可。

好吧，作者已经在向月亮示爱了。呵呵 _

运行一下程序，看修改模板后的效果。

《开源精选》是我们分享Github、Gitee等开源社区中优质项目的栏目，包括技术、学习、实用与各种有趣的内容。本期推荐的是几个优质的DevOps开源工具。

Jpom是一个简而轻的低侵入式在线构建、自动部署、日常运维、项目监控软件。当项目出现问题时，可以能够通过Jpom即时排查问题，问题解决后还可以直接上传修改后的Jar，项目的堆栈信息，服务器CPU、内存使用情况一目了然，不必再登录服务器管理。

项目地址：https://github.com/dromara/Jpom

猪齿鱼Choerodon全场景效能平台，提供体系化方法论和协作、测试、DevOps及容器工具，帮助企业拉通需求、设计、开发、部署、测试和运营流程，一站式提高管理效率和质量。从团队协同到DevOps工具链、从平台工具到体系化方法论，猪齿鱼全面满足协同管理与工程效率需求，贯穿端到端全流程，助力团队效能更快更强更稳定。

项目地址：https://github.com/open-hand/choerodon

面向中小型企业设计的无 Agent的自动化运维平台，整合了主机管理、主机批量执行、主机在线终端、文件在线上传下载、应用发布、任务计划、配置中心、监控、报警等一系列功能。

项目地址：https://gitee.com/openspug/spug

walle 让用户代码发布终于可以不只能选择 jenkins！支持各种web代码发布，php、java、python、go等代码的发布、回滚可以通过web来一键完成。walle 一个可自由配置项目，更人性化，高颜值，支持git、多用户、多语言、多项目、多环境同时部署的开源上线部署系统。

项目地址：https://github.com/meolu/walle-web

Zadig 是一款面向开发者设计的云原生持续交付(Continuous Delivery)产品，具备高可用 CI/CD 能力，提供云原生运行环境，支持开发者本地联调、微服务并行构建和部署、集成测试等。

项目地址：https://gitee.com/koderover/zadig

Gokins一款由Go语言和Vue编写的款轻量级、能够持续集成和持续交付的工具。作为一个可扩展的自动化服务器，Gokins 可以用作简单的 CI 服务器，或者变成任何项目的持续交付中心。

项目地址：https://gitee.com/gokins/gokins

KubeSphere 愿景是打造一个以 Kubernetes 为内核的云原生分布式操作系统，它的架构可以非常方便地使第三方应用与云原生生态组件进行即插即用（plug-and-play）的集成，支持云原生应用在多云与多集群的统一分发和运维管理。

项目地址：https://gitee.com/kubesphere/ks-devops