4月

4 月

pubdate:2020-04-08 15:27:33

tags:总结，日记

2020-4-1

昨天那个配置项的实现过于复杂了，今天将她优化了一下

definition.ts 定义了类型和一个查找元素的方法

          typescript
          
        
export enum value_type {
  "string",
  "img",
  /** 嵌套 config_group 这个难度高一点，可以以后实现 */
  "config_group",
}

type Config_base = { title: string; description: string };

export type Config_item =
  | (Config_base & {
      type: value_type.string;
      value: string;
    })
  | (Config_base & {
      type: value_type.config_group;
      value: Config_item[];
    });

/** 根据路径查找元素 */
export function find_item(path: string, json: Config_item[] | Config_item): Config_item | undefined | Error {
  const path_list = path.split(" ");
  const cur_selector = path_list.shift();
  if (!cur_selector) {
    return undefined;
  }

  if (Array.isArray(json)) {
    if (cur_selector.startsWith("#")) {
      // 根据 title 查询
      const title = cur_selector.replace("#", "");

      const cur = json.find((el) => el.title === title);
      if (path_list.length === 0) {
        return cur;
      } else {
        return find_item(path_list.join(" "), cur!);
      }
    } else {
      return undefined;
    }
  } else {
    if (/** 嵌套类型 */ [value_type.config_group].includes(json.type)) {
      if ((json.type = value_type.config_group)) {
        return find_item([cur_selector, ...path_list].join(" "), json.value);
      } else {
        return new Error("新的嵌套类型要写新的处理方法");
      }
    } else if (json.type === value_type.string) {
      if (path_list.length === 0) {
        return json;
      } else {
        return new Error("路径错误");
      }
    } else {
      // 有新的类型和逻辑应当在这里实现
      return undefined;
    }
  }
}

config_item.vue 配置项的组件

vue

3.发现 typescript Playground 出 v3 版了 Playground V3 Playground V3 前面那个测试版地址过期了里面还有许多帮助理解的例子

2020-4-6

使用负 margin 来实现列表间距相等例如 item:not(:first-child){margin-top:-35px}

发现了 you-dont-know-js 这本书，打算读完

2020-4-7

es2015 中规定了变量和方法可以从句法位置推断匿名函数的名称，所以以前认为的匿名函数现在可能推断出名字

2020-4-8

npm 从 Git 安装包，npm i git+ssh://git@git.bool.link:bool_dev_team/component-type.git

vetur 自定义组件的类型声明官方文档的只言片语可参见 ElementUI 这里的例子，这个必须作为包被安装才能生效，在当前项目中写是享受不到这个提示的

向前兼容和向后兼容「其实当初应该翻译成”回溯兼容“(backward compatibility)和”前瞻兼容“(forward compatibility)就不会出现理解问题了。」

2020-4-9

发现了 moment.js

2020-4-10

今天使用 moment.js 处理了很多逻辑，这个库处理时间很好用。

想到一个点子：复制浏览器的 har 到网页，网页解析数据

生成比较好的展现格式可以复制给后端使用

可以对比 har 高亮差异数据

2020-4-11

了解 rog2 游戏手机和黑鲨游戏手机

uni-app 的 url 传参貌似还是支持挺长的字符串的，但究竟适配性如何没有详细了解，使用的时候还是要节约一些空间

2020-4-15

          typescript
          
        
const list = [
  [1, 2, 3],
  [4, 5, 6],
  [7, 8, 9],
];

uni-app 微信小程序 v-for 如果嵌套的话变量名不能重复，里层的无法覆盖外层同名变量，两个 index 生效的只有第一层的 index ，这会导致奇怪的事情例如数据是如上的 list 然后给每个生成的元素一个点击事件打印自身，无论如何打印的值也只有 1 5 9 这就是因为 index 一直采用的是第一层循环的

2020-4-17 tailwind css对于小程序按钮样式的影响

          css
          
        
/* 罪魁祸首 */
/**
 * Correct the inability to style clickable types in iOS and Safari.
 */
button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
}
/** 解决方案 */
button,
[type="button"],
[type="reset"],
[type="submit"] {
  -moz-appearance: none;
  -webkit-appearance: none;
}

tailwind.css 对于小程序按钮样式的影响，前两天发现小程序按钮的默认样式一直去不掉，今天才发现是因为 tailwind.css 导致的。他有一段上面那样的 CSS 采用了系统自定义的按钮样式导致你怎么覆盖 button::after 都没有用

2020-4-19

写了一个让百度系的一些图标变灰的脚本

word-break: break-all; 这个 CSS 属性可以正确截断长文本（单词）

2020-4-21

最近 vscode 总是报错 Couldn't download IntelliCode model. Please check your network connectivity or firewall settings. 我去网上查了查一开始以为是因为网络问题，后来打开 vscode 的输出仔细看了看是因为 vscode 没有权限打开一个 model.json 的文件。所以使用管理员打开 vscode 就 ok 了

CSS 元素靠底主要靠父元素设置 display:flex;flex-direction:column; 需要置底的元素再设置 margin-top:auto

发现了一个调色神器

2020-4-22

昨天发现界面上的圆不够圆，当时猜测是渲染方式的问题，今天从小到大画了一些圆发现偶数大小的圆最容易出现这种情况，奇数圆则好很多

2020-4-24

以前从网上找过激活码用来激活 office 前一段时间买了个正版的，但生效的还是之前的 2016 专业版当时想着能用也就没管，但今天用不了了，最后使用 office 疑难解答成功的切换到了 2019 的正版。 Microsoft account | 服务和订阅在这里登录账号后可以下单

2020-4-25

今天发现了黑客派这个社区，并且尝试了推送文章到那里。

发现了 Ajax-hook 这个库可以很方便的对请求做一些骚操作

2020-4-26

今天又被 npm 包的 .d.ts 报错搞得心态有点炸，解决方案是配置 tsconfig.json 的 "skipLibCheck": true 选项，之前也遇到过就是不长记性

成功的实现了和黑客派的文章推送

2020-4-28

必应每日一图图片地址实现方式如下（使用的 nest 框架）

          javascript
          
        
// controller.ts
@Get('redirect_to_bing_daily_picture_address')
@Redirect('https://cn.bing.com', 302)
async 重定向到必应每日图片地址() {
  /** [nest 重定向文档](https://docs.nestjs.cn/6/controllers?id=重定向) */
  return { url: await this.utilService.获取必应每日图纸地址() };
}
// utilService.ts
async 获取必应每日图纸地址() {
  const base = 'https://cn.bing.com';
  const res = await Axios({
    url: base + '/HPImageArchive.aspx?format=js&idx=0&n=1',
    method: 'GET',
    responseType: 'json',
  });
  return base + res.data.images[0].url;
}