背景

最近在做一个答题小程序，部分题型中试题数量比较大，一把带出来所有的试题，经过测试界面在试题数量大概在 100 道以上就会开始卡顿，而且试题越多，首次进来加载的时间越长。

一开始想的方案是分页进行加载，但是加载第二页的时候因为要请求接口，所以体验不是特别好。这种分页方式，还有个很大的问题，就是实现“答题卡”功能，在各个试题中跳转比较麻烦。于是在网上搜索，发现一种方案能完美解决这个问题。

背景

画前端页面的时候，偶尔会遇到一个需求。在一个 div 中，既有背景颜色，又有背景图片，而且背景图要在背景色之上。

/* 这种分开写的方式，把颜色写在图片之前，背景颜色会被图片覆盖，不显示 */
background-color: #f5f5f5;
background: url('./images/banner11.png') no-repeat scroll left bottom/cover;

/* 把背景色写在背景图之后就可以实现需求 */
background: url('./images/banner11.png') no-repeat scroll left bottom/cover;
background-color: #f5f5f5;

/* 也可以采用这种简写的方式，依然有效*/
background: #f5f5f5 url('./images/banner11.png') no-repeat scroll left
  bottom/cover;

背景

给一个 Vue2 项目开发新功能，在一个 el-dialog 中使用了 el-tabs 组件做了一个详情页，在第一个页面使用时候正常。在第二个页面使用的时候，浏览器卡死了，无法操作，强制刷新都不行。

首先排查了下自己代码中的逻辑问题，然后在网上找了下：

背景

用 node.js 开发一个项目，需要把之前 MongoDB 数据库中的数据，转换成 MySQL。因为对 SQL 语句不是特别熟悉，所以决定导出成 json 文件，然后手动转换。于是发现个之前没有遇到过的问题，在 node.js 中如何读取 json 文件。

首先要明确，node.js 项目默认遵循 CommonJS 模块化规范，所以读取 json 文件的方式和 ES6 模块化规范不一样。如果一定要使用 import 方法，需要在 package.json 中添加"type": "module"。注意两种规范不能混用。

背景

启动一个 Vue3 项目，报了上边的错误。网上查找后，发现有可能是端口没权限，手动在 package.json 中修改了端口，但是还是报错。最终使用下边方法解决：

netstat -ano| findstr 9527

背景

做后台管理项目的时候，有时候会遇到可编辑表格的需求。还有一种需求，是在可编辑的表格表头上，加上 ElementUI 中表示必填的红色*。

   <el-table-column
          :render-header="addRedStar"
          prop="supportFund"
          label="经费额（万元）"
          align="center"
          :render-header="addStar"
        >
  </el-table-column>

背景

昨天旁边同事在做一个功能，从接口获取数组数据，前端页面进行遍历展示。默认只展示每条数据上的部分字段，当点击该条数据旁边的展开按钮后，该条数据下边会展开一个面板展示该条数据的完整字段。

我给他出的主意是，在拿到接口数据的时候，可以先遍历一次接口数据，并且给每条数据中增加一个字段，用来控制该条数据是否展开。并且这个动作要在赋值给页面中遍历的那个对象之前完成。因为赋值之后再增加的属性，默认就不是响应式的啦。（PS: 通过官方提供的$set 方法倒是可以）