• 一维数组转二维数组


    vue项目中经验:

    1.后台发送过来的json文件是一维数组
    2.我需要像swiper传递过去数据(注: 我的swiper里面放的不是图片,而是一个个小小的选项)如下图
    一页存放8个,有2页,但是传递给我的json数据是一个一维数组所以需要改成二维数组
    然后再v-for这个二维数组,之后再v-for取出小object的属性值

    处理前:

    处理后:

    具体代码:

    1.我将axios 获取到的 一维数组 数据存放到 data中的foods中去
    2.然后我在计算属性computed中进行"改造":
      computed:{
       categoryArr(){
        //获取到foods
        const {foods} = this
        //准备二维数组
        const arr = [];
        let minArr = [];
        //遍历foods
        foods.forEach(category => {
          //如果小数组满了,创建一个新的小数组(所以上班创建minArr不用const而是用let)
          if(minArr.length === 8){
            minArr = [];
          }
          //如果minArr是空的,将小数组保存到大数组中
          if(minArr.length === 0){
            arr.push(minArr)
          }
          //将当前分类数据保存到小数组中
          minArr.push(category)
        });
        return arr;
       }
      }
    3.这样就把一维数组转变成了二维数组;当然了我们可以自己决定二维数组中每个小数组的长度为多少
    4.我直接将categoryArr传给了子组件,然后v-for套一个v-for就可以了
  • 相关阅读:
    Sass开发环境搭建
    三款Javascript SPAs框架资料整理和总结
    Web纯前端“旭日图”实现元素周期表
    能在多种前端框架下使用的表格控件
    控件使用经验-MVP模式+控件封装
    最好的Angular2表格控件
    跨平台开发的两种方法及其对比
    是时候 UWP 了 !
    你的系统也可以拥有“数据透视表”功能!
    Xamarin 免费了,你能做什么?
  • 原文地址:https://www.cnblogs.com/a973692898/p/13214790.html
Copyright © 2020-2023  润新知