mp-vue搭建博客小程序(二)

didikee 发布于2019-08-16 14:02 / 1317人阅读

摘要：本项目的功能可以查看所有发布的文章，并且可以看到文章的所属标签和发布时间可以按标签分类查看文章可以对文章进行评论对文章的点击量进行统计，可以查看热门文章查看文章详细要能支持语法实现过程引进下载的的文件，把下载的文件放到项目路径下面。

本项目的功能

可以查看所有发布的文章，并且可以看到文章的所属标签和发布时间

可以按标签分类查看文章

可以对文章进行评论

对文章的点击量进行统计，可以查看热门文章

查看文章详细要能支持markdown语法

实现过程

引进weui,下载weui的css的文件，把下载的weuicss文件放到项目static/weui/路径下面。

下载地址：https://github.com/KuangPF/mp...

新建首页，可以查看所有文章，用图文组合列表样式，显示文章列表，新建一个方法用来调用后台接口获取文章列表

export function getRequest(url, data) {
  var getRequest = wxPromisify(wx.request)
  return getRequest({
    url: url,
    method: "GET",
    data: data,
    header: {
      "Content-Type": "application/json"
    }
  })
}

然后再页面就可以调用后台接口了，

      wxRequest.getRequest("http://localhost:8763/permiBlog/getAllBlog",params).then(res=>{
       console.log(res.data.code);
       if(res!=null && res.data.code=="0"){
            for(var i=0;i
需要注意的是，小程序调用后台接口，是要用域名并且是https协议来调用，本地调试的时候，要设置为不校验合法域名

首页还实现了上拉到底部，再获取分页数据的功能，首先在app.json的windows配置
"enablePullDownRefresh": true
然后再首页实现两个方法
// 上拉加载
onReachBottom: function () {
    //执行上拉执行的功能      
 this.getArticleList(this.page+1,5);
},
// 停止下拉刷新
async onPullDownRefresh() {
 // to doing..
  // 停止下拉刷新
 wx.stopPullDownRefresh();
},

这样小程序首页就完成了。

GPU云服务器云服务器小程序二次开发搭建小程序免费搭建小程序微信小程序搭建

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/72775.html

mp-vue搭建博客小程序(一)

摘要：开发前准备申请小程序开发者账号登陆微信开发者平台下载微信小程序开发工具安装这样一个基于的小程序项目就建成了，再打开微信开发工具，指到该项目路径，就可以预览到小程序的界面了，如下以下是新建的小程序的代码结构小程序的前后端代码地址开发前准备申请小程序开发者账号,登陆微信开发者平台下载微信小程序开发工具安装mp-vue vue init mpvue/mpvue-quickstar...

elva 2019-08-16 14:02 评论0 收藏0
vue express mongodb 电商项目(二)

摘要：最近花了几天时间把原来写的这个商城项目又改进了一点部署到企鹅云粗略的把项目打包了一下然后部署到了腾讯云试一下效果既然都丢上去了那也就留一个线上体验的地址我看资料都要搞个我在云主机上也按了一个但怎么配置怎么搞这个反向代理负载均衡啊还是一头雾水最近花了几天时间把原来写的这个商城项目又改进了一点部署到企鹅云粗略的把项目打包了一下,然后部署到了腾讯云,试一下效果,既然都丢上去了,那也就留...

zhangqh 2019-08-22 16:34 评论0 收藏0
学习Python想放弃，因为你没有培养自己的兴趣！

摘要：为啥你天天刷抖音一点都不烦，因为你觉得视频好看你有兴趣啊。比如我们说你玩是不是要开始搭建一个自己的网站，是不是可以自己写一个小的脚本来自动发消息给你的女朋友等等，通过这样的小例子来慢慢的培养自己的学习的兴趣。学习，切勿贪快贪多。大家好，我是菜鸟哥！周末啦，跟大家聊一下我们粉丝团的情况...

ideaa 2021-11-23 09:51 评论0 收藏0
hapi框架搭建记录(二)：路由改造和生成接口文档

摘要：框架，用官网的简介来说就是是构建应用程序和服务的丰富框架，它使开发人员能够专注于编写可重用的应用程序逻辑，而不是花时间构建基础设施。用自己的话简单来说，就是个类似，之类的服务基础框架。 showImg(https://segmentfault.com/img/bVbrV3m?w=572&h=350); hapi框架，用官网的简介来说就是：Hapi是构建应用程序和服务的丰富框架，它使开...

opengps 2019-08-23 17:11 评论0 收藏0