golang+beego+ext.js+mysql学习第一课

2024-05-07 10:08

本文主要是介绍golang+beego+ext.js+mysql学习第一课,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

为什么前端用ext.js呢,因为主要学习目的是做后台管理类项目,目前此类项目都是单页面应用,比较流行的是VUE.JS,这东西我折腾了4天,愣是环境都没配置好,因为它需要npm各种支持库什么的,总是报错。

后来才开始研究ext.js,因为我们公司有个做java的,对这东西有点熟悉,而且用它做过项目,所以,当我有问题的时候就能问下,当然,在整个开发过程中,我也踩了n多坑,满眼泪啊。ext感觉不错,不用学H5,CSS哈哈,只要js即可

使用beego和ext.js自动建立新项目,然后把ext.js建立的项目目录拷贝到beego建立的项目目录的static目录下


此时,通过

http://127.0.0.1:8080/static/ext/index.html

可以正常打开以下页面

至此,开发环境准备完毕,开始进入开发阶段。

先在此处新建 Userlist.js文件,该文件用来定义列表布局


文件具体内容如下

Ext.define('ext.view.user.UserList', {extend: 'Ext.grid.Panel',
    xtype: 'userlist',
    //应用自定义样式 sass/src/panel/Panel.scss
    ui : 'highlight',
    frame : 'true',

    requires: ['ext.store.User'
    ],

    title: '用户管理',

    store: {type: 'user'
    },

    columns: [{ text: '姓名',  dataIndex: 'Id' },
        { text: '邮箱', dataIndex: 'Name', flex: 1 },
        { text: '电话', dataIndex: 'Phone', flex: 1 }],

    listeners: {select: 'onItemSelected'
    }
});
这里要注意的是,列名必须和后端定义的一致,其中
ext.store.User
就是我们马上要建立的文件。在如下位置创建文件


该文件负责和后端沟通,请求并接收数据,文件内容如下

Ext.define('ext.store.User', {extend: 'Ext.data.Store',
    storeId:'userStore',
    alias: 'store.user',
    autoLoad:true,
    //pageSize : 10,
    fields: ['Id','Name','Phone'
    ],
    proxy: {type: 'ajax',
         url : 'http://127.0.0.1:8080/user',
        actionMethods : {read: 'POST' // Store设置请求的方法,与Ajax请求有区别
         },
        reader: {type: 'json',
            rootProperty: 'data'// 数据(不配置的话无法接收数据),返回的key为data
            //totalProperty : 'total'// 记录数(不配置的话无法翻页),返回的key为totalRecord
        }}
})
然后,修改main.js文件,使包含

'ext.view.user.UserList',
并且修改

items: [{title: '首页',
    iconCls: 'fa-home',
    // The following grid shares a store with the classic version's grid as well!
    items: [{xtype: 'mainlist'
    }]
}, {title: '用户管理',
    iconCls: 'fa-user',
    items: [{xtype: 'userlist'
    }]
}, {
就是为了让用户管理这部分,对应我们刚才定义的userlist界面布局

至此,前段ext.js部分处理完成,下面开始处理后端beego部分内容

先修改app.conf文件,设置数据库连接相关信息

mysqluser = "root"
mysqlpass = "123456"
mysqlurls = "127.0.0.1"
mysqldb = "blog"
mysqlport = "3306"
然后修改 route.go文件,增加路由请求处理,

beego.Router("/user", &controllers.UserController{})
这里的地址,要和前端USER.JS里的对应。

然后增加控制层文件,controllers下新增user.go文件,内容如下

package controllers
import ("github.com/astaxie/beego"
       ."quickstart/models"
       "fmt"
)
type UserController struct {beego.Controller
}func (this *UserController) Post() {page, _ := this.GetInt("page")limit,_ := this.GetInt("limit")status,_ := this.GetInt("status")srt := this.GetString("status")println("page",page)println("limit",limit)println("status",status)println("status",srt)_, _, alb := ListUser()fmt.Println("alb",alb)this.Data["json"] = map[string]interface{}{"data": alb}this.ServeJSON()
}
对了这里有个问题,我的编辑器界面中GetInet等函数名都是红色,但是编译的时候不报错,我用的是gogland,就是下面这样


谁知道这是什么情况,告诉我下。

这个文件就是为了取出参数,然后利用ListUser来查询数据,返回值是alb

但是返回给前端ext的时候,还必须再次封装,前面加data,因为前端接收数据是这样

reader: {type: 'json',
    rootProperty: 'data'// 数据(不配置的话无法接收数据),返回的key为data
    //totalProperty : 'total'// 记录数(不配置的话无法翻页),返回的key为totalRecord
}
如果不封装,前端就接收不到,我测试了多种封装办法,最后才发现这样是正确的,一个大坑被踩平。

在这里,我还发现个不理解的问题,beego的controllers层,似乎最后只能用

this.ServeJSON()
this.TplName = "album.tpl"
等两种方式返回数据给前端,好像不用用 return XXXX 这种方式返回数据。

然后在 model目录里建立 user.go文件,内容如下

package modelsimport (//"strconv"
       //"time"

       "github.com/astaxie/beego/orm"
       _ "github.com/go-sql-driver/mysql"
       "fmt"
)type Usertest struct {Id       int
       Name    string
       Phone  string
}func (this *Usertest) TableName() string {return "testuser"
}func init() {orm.RegisterModel(new(Usertest))
}func ListUser() (num int64, err error, alb []Usertest) {o := orm.NewOrm()var maps []orm.Paramso.Raw("select id,name,phone from testuser").Values(&maps)fmt.Println(maps)qs := o.QueryTable("testuser")cond := orm.NewCondition()qs = qs.SetCond(cond)var albums []Usertestnum, err1 := qs.Limit(100, 0).All(&albums)return num, err1, albums
}
这个文件用来从数据库查询并返回数据,这里有个坑

qs := o.QueryTable("testuser")
这个表名,必须和

func (this *Usertest) TableName() string {return "testuser"
}
这里相同才行,否则一直提示找不到表。

然后还需要2个数据库初始化的文件,先在项目下,建立initial文件夹,然后建立init.go,内容如下

package initialfunc init() {InitSql()
}
然后建立 sql.go

package initialimport ("fmt"

       "github.com/astaxie/beego"
       "github.com/astaxie/beego/orm"
       _ "github.com/go-sql-driver/mysql"
)func InitSql() {//数据库连接初始化
       user := beego.AppConfig.String("mysqluser")passwd := beego.AppConfig.String("mysqlpass")host := beego.AppConfig.String("mysqlurls")port, err := beego.AppConfig.Int("mysqlport")dbname := beego.AppConfig.String("mysqldb")if nil != err {port = 3306
       }orm.Debug = true
       orm.RegisterDriver("mysql", orm.DRMySQL)//orm.RegisterDataBase("default", "mysql", "root:@/blog?charset=utf8", 30)
       orm.RegisterDataBase("default", "mysql", fmt.Sprintf("%s:%s@tcp(%s:%d)/%s?charset=utf8", user, passwd, host, port, dbname))}

这里就是连接数据库了

然后修改main.go

使包含数据库初始化连接

_"quickstart/initial"
下面就是建立数据库了,建一个blog的库,增加以下表

CREATE TABLE `testuser` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `name` varchar(30) DEFAULT NULL,
  `phone` varchar(30) DEFAULT NULL,
  PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=2 DEFAULT CHARSET=utf8;

现在终于完成了,看看效果吧


我这样从c/s结构转b/s结构的开发人员,感觉这个b/s结构的层次好复杂,前端就需要3层,后端同样是3层,完成一个功能,至少要修改6个文件,也许等以后熟悉了,就会习惯了吧。

这篇关于golang+beego+ext.js+mysql学习第一课的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/967049

相关文章

HarmonyOS学习(七)——UI(五)常用布局总结

自适应布局 1.1、线性布局(LinearLayout) 通过线性容器Row和Column实现线性布局。Column容器内的子组件按照垂直方向排列,Row组件中的子组件按照水平方向排列。 属性说明space通过space参数设置主轴上子组件的间距,达到各子组件在排列上的等间距效果alignItems设置子组件在交叉轴上的对齐方式,且在各类尺寸屏幕上表现一致,其中交叉轴为垂直时,取值为Vert

Ilya-AI分享的他在OpenAI学习到的15个提示工程技巧

Ilya(不是本人,claude AI)在社交媒体上分享了他在OpenAI学习到的15个Prompt撰写技巧。 以下是详细的内容: 提示精确化:在编写提示时,力求表达清晰准确。清楚地阐述任务需求和概念定义至关重要。例:不用"分析文本",而用"判断这段话的情感倾向:积极、消极还是中性"。 快速迭代:善于快速连续调整提示。熟练的提示工程师能够灵活地进行多轮优化。例:从"总结文章"到"用

JS常用组件收集

收集了一些平时遇到的前端比较优秀的组件,方便以后开发的时候查找!!! 函数工具: Lodash 页面固定: stickUp、jQuery.Pin 轮播: unslider、swiper 开关: switch 复选框: icheck 气泡: grumble 隐藏元素: Headroom

SQL中的外键约束

外键约束用于表示两张表中的指标连接关系。外键约束的作用主要有以下三点: 1.确保子表中的某个字段(外键)只能引用父表中的有效记录2.主表中的列被删除时,子表中的关联列也会被删除3.主表中的列更新时,子表中的关联元素也会被更新 子表中的元素指向主表 以下是一个外键约束的实例展示

基于MySQL Binlog的Elasticsearch数据同步实践

一、为什么要做 随着马蜂窝的逐渐发展,我们的业务数据越来越多,单纯使用 MySQL 已经不能满足我们的数据查询需求,例如对于商品、订单等数据的多维度检索。 使用 Elasticsearch 存储业务数据可以很好的解决我们业务中的搜索需求。而数据进行异构存储后,随之而来的就是数据同步的问题。 二、现有方法及问题 对于数据同步,我们目前的解决方案是建立数据中间表。把需要检索的业务数据,统一放到一张M

如何去写一手好SQL

MySQL性能 最大数据量 抛开数据量和并发数,谈性能都是耍流氓。MySQL没有限制单表最大记录数,它取决于操作系统对文件大小的限制。 《阿里巴巴Java开发手册》提出单表行数超过500万行或者单表容量超过2GB,才推荐分库分表。性能由综合因素决定,抛开业务复杂度,影响程度依次是硬件配置、MySQL配置、数据表设计、索引优化。500万这个值仅供参考,并非铁律。 博主曾经操作过超过4亿行数据

【前端学习】AntV G6-08 深入图形与图形分组、自定义节点、节点动画(下)

【课程链接】 AntV G6:深入图形与图形分组、自定义节点、节点动画(下)_哔哩哔哩_bilibili 本章十吾老师讲解了一个复杂的自定义节点中,应该怎样去计算和绘制图形,如何给一个图形制作不间断的动画,以及在鼠标事件之后产生动画。(有点难,需要好好理解) <!DOCTYPE html><html><head><meta charset="UTF-8"><title>06

学习hash总结

2014/1/29/   最近刚开始学hash,名字很陌生,但是hash的思想却很熟悉,以前早就做过此类的题,但是不知道这就是hash思想而已,说白了hash就是一个映射,往往灵活利用数组的下标来实现算法,hash的作用:1、判重;2、统计次数;

性能分析之MySQL索引实战案例

文章目录 一、前言二、准备三、MySQL索引优化四、MySQL 索引知识回顾五、总结 一、前言 在上一讲性能工具之 JProfiler 简单登录案例分析实战中已经发现SQL没有建立索引问题,本文将一起从代码层去分析为什么没有建立索引? 开源ERP项目地址:https://gitee.com/jishenghua/JSH_ERP 二、准备 打开IDEA找到登录请求资源路径位置

MySQL数据库宕机,启动不起来,教你一招搞定!

作者介绍:老苏,10余年DBA工作运维经验,擅长Oracle、MySQL、PG、Mongodb数据库运维(如安装迁移,性能优化、故障应急处理等)公众号:老苏畅谈运维欢迎关注本人公众号,更多精彩与您分享。 MySQL数据库宕机,数据页损坏问题,启动不起来,该如何排查和解决,本文将为你说明具体的排查过程。 查看MySQL error日志 查看 MySQL error日志,排查哪个表(表空间