# vue110

**Repository Path**: UNDEFINEDNULL/vue110

## Basic Information

- **Project Name**: vue110
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2018-08-29
- **Last Updated**: 2020-12-19

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

#这是用来描述项目信息的文件 


#加载首页轮播图数据
1、使用 vue-resource 获取数据
2、使用 vue-resource 的 this.$http.get 获取数据
3、获取到的数据要保存到 data 上
4、使用 v-for 循环每个 item 项


#改造新闻资讯链接
##新闻资讯页面的制作
1、绘制界面，使用  MUI 中的 media-list.html
2、使用 vue-resource 获取数据
3、渲染真实数据


## 实现 新闻资讯列表 跳转到 新闻详情
1、把列表中的每一项改为 router-link，并提供唯一标识符
2、创建新闻详情的组件页面 NewsInfo.vue
3、在路由模块中将新闻详情的 路由地址 和 组件页面 对应起来


##单独封装一个 comment.vue 评论子组件
1、先创建一个单独的 comment.vue 组件模板
2、在需要使用 comment 组件的页面中，先手动导入 comment 组件
+ 'import comment from './comment.vue''
3、在父组件中使用 components 属性将 comment 组件注册为子组件
4、将注册子组件时的注册名称以标签形式在页面中引用


##获取所有评论数据显示到页面中


##实现点击加载更多评论的功能
1、为加载更多按钮，绑定点击事件，在事件中去请求下一页数据
2、点击加载更多让 pageIndex++，然后重新调用 this.comments 方法重新获取最新一页的数据
3、点击加载更多时，每获取新的数据就让老数据调用数组的 concat 方法，拼接新数据


## 发表评论
1、把文本框做双向数据绑定
2、为发表按钮绑定事件
3、校验评论内容是否为空，为空则Toast提示用户评论内容不能为空
4、通过 vue-resource 发送请求把评论内容提交给服务器
5、发表评论后，重新刷新列表以查看最新评论