Quartz 4

实用代码片段

3 min read

实用代码片段

mock

模拟接口

  const waitTime = (time = 2000) => {
    return new Promise((resolve) => {
      setTimeout(() => {
        resolve(true);
      }, time);
    });
  };
 
cosnt search =async () => {
 
    await waitTime()
}

模拟表格数据

function generateMockData(columns, length) {
  const data = [];
  
  for (let i = 1; i <= length; i++) {
    const visitor = {};
    
    columns.forEach(column => {
      visitor[column.key] = `${column.title} ${i}`;
    });
    
    data.push(visitor);
  }
  
  return data;
}

这个函数接收两个参数，第一个参数是列配置数组，第二个参数是生成模拟数据的长度。在循环中，我们遍历列配置数组，根据每个列的key和title生成对应的属性和模拟数据。

使用时，只需要将列配置和数据长度传入即可：

const mockColumns = [
  { title: "访客姓名", key: "1" },
  { title: "访客手机号", key: "2" },
  { title: "访客所属公司", key: "3" },
  // 其他列配置...
];
 
const mockData = generateMockData(mockColumns, 20); // 生成20条模拟数据
 
// 将mockColumns和mockData作为参数传递给表格组件
<Table columns={mockColumns} dataSource={mockData} />

dom操作

模拟鼠标点击

const a = document.querySelector('a[href="#1"]');
if (a) a.dispatchEvent(new MouseEvent('click', {bubbles: true}));

字符串

获取字符串字节数/字符数

使用场景

//返回字符串的总字节数 
let byteleng = strval.replace(/[^\x00-\xff]/g,'**').length;

工具函数

计算表格数据的最后一页有几条数据

table

  /**
   * @param {*} totalCount 总数
   * @param {*} pageSize 一页几条
   * @param {*} totalPages 一共几页
   */
  const calculateLastPageCount = (totalCount, pageSize, totalPages) => {
    const remainder = totalCount % pageSize;
    if (totalPages === 1) {
      return remainder === 0 ? pageSize : remainder;
    } else {
      return remainder === 0 ? pageSize : remainder;
    }
  }

对象参数序列化为URL查询字符串的函数

数据请求

serializeParams函数接受一个参数params，默认为空对象。
使用Object.keys(params)获取params对象的所有键组成的数组。
对每个键值对执行map操作，将每个键值对转换为encodeURIComponent(key)=encodeURIComponent(params[key])的形式。
encodeURIComponent用于对URI中的特殊字符进行编码，以避免造成URI语法错误。
使用join('&')将所有转换后的键值对用&连接起来，形成最终的URL查询

 
export const serializeParams = (params = {}) => {
  return Object.keys(params)
    .map(key => `${encodeURIComponent(key)}=${encodeURIComponent(params[key])}`)
    .join('&');
};
 
const params = {
  name: 'Alice',
  age: 30,
  city: 'New York'
};
 
const queryString = serializeParams(params);
console.log(queryString);
// 输出：name=Alice&age=30&city=New%20York

Graph View