资讯专栏INFORMATION COLUMN

19年8月4日

zhangrxiang / 2534人阅读

摘要:一周技术总结和分享这周工作中遇到了一个多层表格筛选列本地化的东西。最后的解决方式是用一起实现多层嵌套筛选项的本地化。全选维度分类维度分类

一周技术总结和分享

这周工作中遇到了一个多层表格筛选列本地化的东西。最后的解决方式是用vux + core一起实现多层嵌套筛选项的本地化。

filterable-columns.js

const byGoodsCol = [
  {
    prop: "all",
    label: "全选",
    children: [
      {
        prop: "weidu1",
        label: "维度分类1",
        children: [
          {
            prop: "a",
            label: "a"
          },
          {
            prop: "b",
            label: "b"
          }
        ]
      },
      {
        prop: "weidu2",
        label: "维度分类2",
        children: [
          {
            prop: "c",
            label: "c"
          },
          {
            prop: "d",
            label: "d"
          }
        ]
      }
    ]
  }
]
export function outCol(type) {
  return {
    byGoodsCol: byGoodsCol,
    byPlatfomrCol: byPlatfomrCol
  }[type]
}

config/local-settings.js

import { outCol } from "./filterable-columns"

const byGoodsCol = outCol("byGoodsCol")

function initDefaultCol(data) {
  data.forEach(item => {
    if (item.children) {
      initDefaultCol(item.children)
    }
    item.checked = true
  })
  return data
}

export default {
  byGoodsCol: initDefaultCol(byGoodsCol)
}

core.js

import defaultSettings from "@/config/local-settings"
export default function Initializer() {
  store.commit("goods/goods_col", Vue.ls.get("BY_GOODS_COL", defaultSettings.byGoodsCol))
}

main.js

import initial from "./core/initial";
new Vue({
  el: "#app",
  router,
  store,
  created() {
    initial();
  },
  render: h => h(App)
});

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

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

相关文章

  • 腾讯云企业钜惠,香港云服务器2.9折,最高10M无限流量,2核4G/48G/8核16G,2052元

    摘要:文章目录一腾讯云官网一腾讯云官网二企业用户爆款秒杀二企业用户爆款秒杀三热门云服务器折起三热门云服务器折起四老用户续费活动四老用户续费活动腾讯云从月日开启了一个企业钜惠助力复苏促销活动,可能由于腾讯云云聚惠活动的开启被大家忽略了其 文章目录一、腾讯云官网二、企业用户爆款秒杀三、热门云服务器2.9折起四、老用户续费活动腾讯云从5月28日开启了一个企业钜惠·助力复苏促销活动,可能由于腾讯...

    PumpkinDylan 评论0 收藏0
  • Java重构-策略模式、状态模式、卫语句

    摘要:前言当代码中出现多重语句或者语句时。代替多重分支这个情况的代替方式是可以为晴天时处理逻辑下雨时处理逻辑阴天时处理逻辑策略模式使用策略模式可以代替多重和语句,让代码维护变得更加简单。状态模式允许一个对象在其内部状态改变的时候改变其行为。 前言 当代码中出现多重if-else语句或者switch语句时。弊端之一:如果这样的代码出现在多处,那么一旦出现需求变更,就需要把所有地方的if-els...

    Sourcelink 评论0 收藏0
  • Frontend Engineer Booklist 前端书单

    摘要:初级书单深入理解人评价作者徐涛出版社机械工业出版社出版年年月日赞回复添加到豆列来自豆瓣读书响应式设计人评价作者出版社人民邮电出版社出版年年月日赞回复添加到豆列来自豆瓣读书深入浅出中文版人评价作者马劳克林出版社东南大学出版社出版年年月 初级书单 深入理解Bootstrap 7.0 (65人评价)作者: 徐涛 出版社: 机械工业出版社 出版年: 2014-52015年1月19日 赞 回复添...

    Lowky 评论0 收藏0
  • Frontend Engineer Booklist 前端书单

    摘要:初级书单深入理解人评价作者徐涛出版社机械工业出版社出版年年月日赞回复添加到豆列来自豆瓣读书响应式设计人评价作者出版社人民邮电出版社出版年年月日赞回复添加到豆列来自豆瓣读书深入浅出中文版人评价作者马劳克林出版社东南大学出版社出版年年月 初级书单 深入理解Bootstrap 7.0 (65人评价)作者: 徐涛 出版社: 机械工业出版社 出版年: 2014-52015年1月19日 赞 回复添...

    ConardLi 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<