ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

从后端获取数据后怎么分类显示在对应标题下?(小白快速上手)

2021-06-29 12:01:37  阅读:168  来源: 互联网

标签:从后 courses 分类 标题 获取数据 小白 key path 数据


当你从后端获取到你所需要的数据,但是这个数据是所有标题下未进行分类的所有数据,那么我们此时就要自己进行分类,通过分类时的判定条件让数据显示在对应区域。

解决方法:

第一步:找出分类数据的判断条件,就是怎么样判断这条数据是在这个标题下,那么很好的一个判断方式就是“根据标题进行分类”,因为这些数据都会有它对应的标题。

第二步:定义一个空对象,用来储存这些标题的内容。

第三步:在watch监听里面用filter方法进行分类。

代码如下:

<script>
import axios from "axios";
export default {
  name: "App",
  data() {
    return {
      path: [],//用来接收后端请求到的数据
      courses: {},//用来储存所有标题的名称
    };
  },
  created() {
    axios({
      url: "",//后端获取数据的地址
      method: "post",
    }).then((res) => {
      this.path= res.data;
    });
  },
  //事件监听
  watch: {
    path: function () {
      this.courses = {};
      this.path.forEach((key) => {
        this.courses[key] = [];
      });
      for (let key in this.courses) {
        this.courses[key] = this.path.filter((item) => item == key);
      }
      console.log("this.courses", this.courses);
    },
  },
};
</script>

根据自身需求添加代码,此方法适用于二级标题,请慎用!!!

如有什么地方不对,请及时指正!

标签:从后,courses,分类,标题,获取数据,小白,key,path,数据
来源: https://blog.csdn.net/m0_59375042/article/details/118330910

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有