本文主要记录了近期在开发中遇到的一些小问题。主要包括以下内容：

一 antd Table 本地排序
1. 纯数字排序
2. 字符串首字母进行排序
3. 时间排序
二 在react项目中，获取即将跳转到的路由信息
三 借助a标签在浏览器中预览图片

一 antd Table 本地排序

以下方法和通常的使用方法相比都添加了默认值，原因是在对实际的业务数据进行排序时，某个字段的值有可能会有很多空值，此时进行排序时，值为空的数据会穿插在有值的记录中，与我们期望的排序结果不一致，我们期望是所有有值的数据应该是挨在一起。下面改进后的方法就可以解决上述的这个问题。下面列举的是项目中常见的三种排序的场景。

1. 纯数字排序

(a: any, b: any) => (a || 0) - (b || 0)

2. 字符串首字母进行排序

(a: any, b: any) => (a || '')?.localeCompare(b || '')

3. 时间排序

这里使用到了dayjs三方工具包，先安装，后引用，然后使用。

npm install dayjs --save

import dayjs from 'dayjs';

(a: any, b: any) => dayjs(a || 0).valueOf() - dayjs(b || 0).valueOf()

二 在react项目中，获取即将跳转到的路由信息

有时，在项目中，我们需要根据即将跳转到的路由信息来判断是不是要保留或销毁当前组件存在公共状态中的一些数据。在react-router的API中，我并没有找到比较方便且适合这种场景的方法，那使用window.location 来获取路由信息也是一种解决方式。以下是我项目中的一个使用方式：

useEffect(() => {

    return () => {

      const { pathname } = window.location;

      if (!needRecordArr.includes(pathname)) {

        //我在这里是销毁了保存在公共状态中的一些数据
        do sth...

      }

    };

  }, []);

三 借助a标签在浏览器中预览图片（直接打开图片）而不是直接下载

<a href='图片地址' >图片地址名称</a>。我们通过a标签请求图片的时候，通常浏览器会有两种表现形式，1是直接打开，2是直接下载。两种表现方式的不同，是因为图片的响应头信息中的Content-Type值不同。

此处摘自该篇博客

问题的原因找到了，那么解决的方式是，让后端的同学修改下响应头的Content-Type信息即可。 如果你和我有相同的需求，或者相反的需求，通过修改Content-Type都是一种解放方式。

好啦，本篇就记录这么多。动起来~