六面体-大师的网站

 2.ICP备案管理（VUE+ Thinkphp+mysql）线上项目：http://icp.liumianti.top/

  账户：张三   密码：123456

设计的初衷：备案资质多达20个项目，有时查看信息时，要翻阅资料，时间浪费很多，因此 制作一个可视化 备案中心页面
开源项目：http://caijt.com/it/#/
前端：
 1. 采用的是vue-cli3.0脚手架开发
 2. elementui 做UI框架
 3. 引入 normalize.css -- 解决不同浏览器 样式的一致性
 4. 引入 NProgress -- 页面打开 进度条提醒
后端：
 数据处理： Thinkphp(增删改查) 难点：联表查询 输出不同表里的指定字段
 数据库：MYSQL
难点：vue-cli3.0 打包后,js多达几十个 怎么解决？
解决方案： 安装 webpack压缩插件-----compression-webpack-plugin，并在vue.config.js 配置
特色：
 1.添加了 微信公众号测试号 扫码登陆功能
 2.对涉及身份证、手机号、邮箱 采用了掩码处理
 3.备案首页--采用城市拼音首字母规则 排序

原文转载：javascript设计模式系列 : https://www.cnblogs.com/webFrontDev/p/3553402.html

两种形式：一种Json数据：{}， 一种Array数据：[]

1） Array篇

export function citysfil (citys) {
  const FristPin = ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z']
  const cityArray = []
  const cityJson = {}
  for (let i = 0; i < FristPin.length; i++) {
    cityJson[FristPin[i]] = citys.filter(function (value) {
      return value.firstletter === FristPin[i]
    })
    cityArray[i] = {
      pinyin: FristPin[i],
      item: cityJson[FristPin[i]]
    }
   
  }

  return cityArray
}

2） Json篇

export function citysfil (citys) {
  const FristPin = ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z']
  const cityArray = []
  const cityJson = {}
  for (let i = 0; i < FristPin.length; i++) {
    cityJson[FristPin[i]] = citys.filter(function (value) {
      return value.firstletter === FristPin[i]
    })
    cityArray[i] = {
      pinyin: FristPin[i],
      item: cityJson[FristPin[i]]
    }   
  }
  return cityArray
}

var str = str.replace(/@@/g,"\n");​​

其中“@@”为要替换的字符