用beego vue.js element axios 写flow办公流程——系列五 - Go语言中文社区

用beego vue.js element axios 写flow办公流程——系列五


golang语言的办公工作流的包介绍——系列一

golang办公工作流workflow利用js-ojus/flow做测试——系列二

golang办公流程引擎初体验js-ojus/flow——系列三

golang办公流程引擎初体验js-ojus/flow——系列四

1.前言

第一次用vue.js,着实费了九牛二虎之力。

自己的认识:

开发的时候一定要用独立的前端,即vue.js前端项目必须是独立的,独立的服务,不要放beego里的view里作为tpl页面。虽然,放beego view里的tpl通过引用vue、element、axios等似乎可以实现不少功能,但是很虐心,不到万不得已不要再去尝试,原因之一当然是没有任何教程和现成的案例是这样搞的,好多东西需要去试验。

当独立搭建起nodejs和vue的环境后,使用淘宝镜像,初始化一个项目,然后各种抄网络代码,行如流水,很顺了。

部署的时候就简单了:

1.在vue.js里,cnpm run build打包,得到dist文件夹,里面有index.html和static文件夹。
2.直接将index.html放到beego的view文件夹下,然后在beego的route里和controllers里加上路由,指向这个index.html即可访问了。
3.进入dist文件夹下static文件夹内,拷贝里面所有文件和文件夹,在来到beego的static文件夹,粘贴,有相同的,则合并文件夹。
4.输入路由,就可以访问了。

原理其实就是利用go语言的静态服务功能。

2.用到的知识

导航条点击切换页面;涉及到路由:搭建VueJS2.9+ElementUI单页面网站,编写导航页,导航栏跳转、切换

axios跨域,其实用beego写的服务端,在路由里设置一下,是允许跨域的了,所以不必在vue项目里再折腾跨域问题了。

element表格和表格服务端分页,和bootstrap table一样,需要数据总数total……

自定义图标,用阿里的图标,用一段代码批量加入购物车,https://www.jianshu.com/p/59dd28f0b9c9

sublime3手动添加vue代码高亮

element表单数据通过axios提交,服务端beego获取formdata或者url带的参数

3.踩到的坑

前端,css的写法最不擅长了。

vue项目拷贝到其他地方,那个node_moduls文件夹太大了,很难拷贝,而且拷不全。出现问题,删除这个文件夹,然后命令行到项目目录下,cnpm install即可。

初始化项目不要选代码规范检查啊,测试啊之类的,我很难写出非常规范的代码。

离flow的实操还有不少距离,比如:表格的在线编辑,一个完整flow流程的实现。

golang办公流程引擎初体验js-ojus/flow——系列四

 

版权声明:本文来源CSDN,感谢博主原创文章,遵循 CC 4.0 by-sa 版权协议,转载请附上原文出处链接和本声明。
原文链接:https://blog.csdn.net/hotqin888/article/details/86764005
站方申明:本站部分内容来自社区用户分享,若涉及侵权,请联系站方删除。
  • 发表于 2020-02-02 17:56:36
  • 阅读 ( 1870 )
  • 分类:前端

0 条评论

请先 登录 后评论

官方社群

GO教程

猜你喜欢