分享开发商城系统系统过程中遇到的问题处理

发表评论
把文本框做双向数据绑定
<textarea placeholder="请输入内容" maxlength="120" v-model="msg"></textarea>
data中 msg: “” // 评论 输入的内容

为发表按钮绑定一个事件
<mt-button type="primary" size="large" @click="postComment">发表评论</mt-button>

校验评论内容是否为空,如果为空,则Toast提示用户 评论内容不能为空
main.js中Vue.http.options.root下面写

//使用ajax的post方式时,第三个参数一般都是一样的,所以每次都重写,还不如全局定义一下,就省略这个重复写的过程。
// 全局设置 post 时候表单数据格式组织形式   application/x-www-form-urlencoded
Vue.http.options.emulateJSON = true;

通过 vue-resource 发送一个请求,把评论内容提交给 服务器
当发表评论OK后,重新刷新列表,以查看最新的评论
如果调用 getComments 方法重新刷新评论列表的话,可能只能得到 最后一页的评论,前几页的评论获取不到
换一种思路: 当评论成功后,在客户端,手动拼接出一个 最新的评论对象,然后 调用 数组的 unshift 方法, 把最新的评论,追加到 data 中 comments 的开头;这样,就能 完美实现刷新评论列表的需求;
想要开发的商城系统开发系统项目咨询v:kjwenlc,希望能帮到您!

 postComment() {
  // 校验是否为空内容  trim() 方法去除字符串的头尾空格:
  if (this.msg.trim().length === 0) {
    return Toast("评论内容不能为空!");
  }

  // 发表评论
  // 参数1: 请求的URL地址
  // 参数2: 提交给服务器的数据对象 { content: this.msg }
  // 参数3: 定义提交时候,表单中数据的格式  { emulateJSON:true }
  this.$http
    .post("api/postcomment/" + this.$route.params.id, {
      content: this.msg.trim()
    })
    .then(function(result) {
      if (result.body.status === 0) {
        // 1. 拼接出一个评论对象
        var cmt = {
          user_name: "匿名用户",
          add_time: Date.now(),
          content: this.msg.trim()
        };
        this.comments.unshift(cmt);
        this.msg = "";
      }
    });
}
  }

改造图片分析 按钮为 路由的链接并显示对应的组件页面

<router-link to="/home/photolist">
<img src="../../images/menu2.png" alt="">
<div class="mui-media-body">图片分享</div>
</router-link>

import PhotoInfo from './components/photos/PhotoInfo.vue'
{ path: '/home/photoinfo/:id', component: PhotoInfo }

绘制 图片列表 组件页面结构并美化样式

  1. 制作 顶部的滑动条
  2. 制作 底部的图片列表
4 声望
0 粉丝
0 条评论
推荐阅读
在线阅读文库系统开发支持手机在线观看下载文档(一)
这个是前端部分的,内容详细页面,也是接着前天更新的进行完善的功能的,希望本文章可以帮到大家的学习和使用。在线文库网站程序源码,也是一款不错的手机微信文库网站系统网站平台,支持手机在线观看下载文档。...

huang阅读 375

怎样用 PHP 来实现枚举?
在数学和计算机科学理论中,一个集的枚举是列出某些有穷序列集的所有成员的程序,或者是一种特定类型对象的计数。这两种类型经常(但不总是)重叠。枚举是一个被命名的整型常数的集合,枚举在日常生活中很常见,...

唯一丶25阅读 6.3k评论 4

PHP转Go实践:xjson解析神器「开源工具集」
我和劲仔都是PHP转Go,身边越来越多做PHP的朋友也逐渐在用Go进行重构,重构过程中,会发现php的json解析操作(系列化与反序列化)是真的香,弱类型语言的各种隐式类型转换,很大程度的减低了程序的复杂度。

王中阳Go8阅读 1.4k评论 2

封面图
图片防盗链破解 解决图片防盗链问题 反向代理
当客户端(浏览器)向服务器请求内容的时候,会提交一个header,这个header中包含了如:浏览器信息、cookie等内容,那么有一个叫referer的东东,也包含在这里面。

TANKING7阅读 11.3k评论 5

Git操作不规范,战友提刀来相见!
年终奖都没了,还要扣我绩效,门都没有,哈哈。这波骚Git操作我也是第一次用,担心闪了腰,所以不仅做了备份,也做了笔记,分享给大家。问题描述小A和我在同时开发一个功能模块,他在优化之前的代码逻辑,我在开...

王中阳Go5阅读 2.1k评论 2

封面图
微信公众号开发:自动回复文本/图片/图文消息/关键词回复/上传素材/自定义菜单
对接流程1、申请微信公众号测试账号URL:[链接]2、登录,配置开发者服务器URL和Token开发者服务器配置代码:config.php {代码...} URL是config.php在你服务器的URLToken是上面代码自己设置的Token搞定之后,就能完...

TANKING2阅读 10.1k

Ajax实现搜索联想 搜索关键词提醒 无刷新搜索
通过javascript监听搜索框的内容,调用后端即可。(1)javascript监听搜索框的内容(2)把搜索框的关键词传给后端进行搜索(3)搜索到结果,遍历到页面

TANKING1阅读 4.4k

4 声望
0 粉丝
宣传栏