KiritoXF

KiritoXF 查看完整档案

填写现居城市  |  填写毕业院校  |  填写所在公司/组织 localhost 编辑
编辑
_ | |__ _ _ __ _ | '_ \| | | |/ _` | | |_) | |_| | (_| | |_.__/ \__,_|\__, | |___/ 个人简介什么都没有

个人动态

KiritoXF 回答了问题 · 2月23日

java中如何在控制台打印Object[] param,toString方法输出的是对象而不是详情啊?

好像可以引个 对象转 JSON 的包,然后转成 JSON 打印出来。或者如果知道 param 的详细内容的话,可以重写 toString 方法

关注 3 回答 3

KiritoXF 赞了回答 · 2月8日

问几个ts的问题

如何给一个接口的key统一加个前缀,如{a:string,b:number}变成{ta:string,tb:number}

3.x版本不支持,从4.1开始支持 Template Literal

// Helpers
type Prefix<T extends string, P extends string> = `${P}${T}`;

type PrefixKey<T, P extends string> = {
  [K in keyof T as Prefix<K & string, P>]: T[K];
};


interface Origin {
  a: string;
  b: number;
}

type Decorated = PrefixKey<Origin, "t">;

如何设置一个函数的返回值是某个接口的key,比如有接口{age:number,name:string},一个函数传入string,然后返回string,但是这函数的返回值是上面那个接口的key,也就是age或者name
type API = (input: string) => Promise<"age" | "name">;

两个结构一样的接口如何优雅的写,比如接口A{a:{b:string}},接口B{c:{d:string}},两个接口的结构和类型是一样的,只有key不一样

只要有不同之处,就是完全不同的类型。所以你说的结构和类型一样的是错误的。在这种情况下,你必须写出每个不同的类型。
如果这两个类型有相似可推导的部分,你可以写一些帮助类型生成你要的新类型。

type MyInterface<K0 extends string, K1 extends string, V> = {
  [Key0 in K0]: {
    [Key1 in K1]: V;
  };
};

type A = MyInterface<"a", "b", string>;
type B = MyInterface<"c", "d", string>;

ts如何通过if判断来设置type,比如true是a|b,false是c|d,我看有个is,不知道是不是

Typescript中是没有if语句的。要进行条件推导,可以使用三元运算。

type MyConditionalType<T extends boolean> = T extends true
  ? "a" | "b"
  : "c" | "d";

关注 3 回答 1

KiritoXF 关注了问题 · 2月7日

问几个ts的问题

求教几个ts的问题,ts版本3.x

  1. 如何给一个接口的key统一加个前缀,如{a:string,b:number}变成{ta:string,tb:number}
  2. 如何设置一个函数的返回值是某个接口的key,比如有接口{age:number,name:string},一个函数传入string,然后返回string,但是这函数的返回值是上面那个接口的key,也就是age或者name
  3. 两个结构一样的接口如何优雅的写,比如接口A{a:{b:string}},接口B{c:{d:string}},两个接口的结构和类型是一样的,只有key不一样
  4. ts如何通过if判断来设置type,比如true是a|b,false是c|d,我看有个is,不知道是不是

关注 3 回答 1

KiritoXF 回答了问题 · 2月3日

解决这是typescript 的什么语法,tsc疯狂报错

这是 TypeScript 3.8的语法 仅仅导入
中文文档:https://jkchao.github.io/type...
英文文档:https://www.typescriptlang.or...

关注 1 回答 2

KiritoXF 赞了回答 · 2月2日

诚心提问,大家到底怎么做移动端适配

rem 和 em 的方案兼容性应该是最好的,早在移动端从 WAP 时代步入 HTML5 时代,rem 就已经可用了。rem 本身只是意思为 root em 的相对单位,因为调整 root 节点的 font size 可以改变所有用 rem 为单位的 CSS 值,因此早期大家喜欢用 rem 来做不同屏幕适配。

viewport 单位其实比 rem 的兼容性稍差的,但是就 2021 的时间点而言,二者都不用考虑兼容性问题了。其实用什么 CSS 单位并不是解决移动端适配的关键,关键其实是 UI 设计本身是如何考量不同宽度及长宽比显示设备的,前端又打算用什么方案去适配。根据 dpr 调整 root 节点的 font-size,rem 也一样可以做到你说的最终解。

成本最低的方案就是 UI 只出一份设计稿,前端根据设备屏幕宽度,在任意设备上整体缩放还原设计稿。比如设计稿是按照 320@2x 设计的(iPhone5),那么在宽度 375px, dpr 为 2 的 iPhone6 上,看到的就是等比放大了 1.17 倍的效果。显然,按钮图标甚至文字都会显得更大。要实现这种方案,你可以用 rem,所以元素宽高统统 rem。当然也可以用 px/vw/vh 配合 viewport meta tag 设置 width=320 而非 device-width,一样能达到等比缩放的效果。也就是我说的,用什么单位不重要,重要的是你按什么方案去实现。

如果希望在更大的屏幕上显示更多的内容,那就不能无脑放大,UI设计的布局也需要能够自适应不同宽度和宽高比。不同组件可能会有不同的响应式解决办法,比如淘宝首页的横向滑动的图标列表,大屏下能显示 5 个,小屏下显示 4 个半,无论大小屏,大家高度都一致。而轮播头图由于我们不能改变图片长宽比,所以只能是大屏上宽度大,整个组件所占的高度也更高。当然如果你考虑得很周全,也可以设计出适配不同宽度而高度一致的轮播图,给不同设备设计不同的图片,按设备加载,只是没必要。

页面上的不同组件或元素,有些不应该按比例缩放,比如文字,按钮,有些可以横向伸缩,比如导航条,搜索框,有些直接缩放会更简单,比如头图,或者网格排列的商品,有些可以均匀分配多余的空间,有些用横向滑动规避掉了不同宽度的问题。这些都需要前端和 UI 设计师共同商讨,必要时 UI 设计师出更多尺寸的设计图来示意布局如何响应式调整。

和高度相关的 UI 设计我猜多半类似 H5 这种一屏一屏滑动的页面,或者类似 H5 游戏一样的,而非传统流式布局结构。这种也不存在大屏需要看到更多的内容的需求了吧?但是等比放大显然不行,设备宽高比不一致,我们希望不同设备上都满屏显示。这种时候就要利用 vw/vh absolute 和百分比定位了。

总结就是无脑等比放大最省事,做响应式则需要针对组件思考不同宽度下的处理方案。个人实践是,viewport 设置 width=device-width ,CSS 单位直接用 px,配合 flex/grid 做自适应布局,极少数场景用 calc + vw/vh 实现特殊的需求。

关注 6 回答 6

KiritoXF 回答了问题 · 1月27日

解决js 双重for循环问题

const data1 = ['empty', 'name'];
const data2 = ['app_secret', 'id'];

let data3 = '';
data1.map((str, index) => {
  data3 += `${data1[index]}=${data2[index]},`;
});

data3 = data3.slice(0, data3.length - 1);
console.log(data3); // "empty=app_secret,name=id"

关注 2 回答 2

KiritoXF 回答了问题 · 1月26日

js三目运算,怎么能简化一下?

如果便于阅读的话,可以用 if 替代三目

let token = '';
let b = token;
if (!token) {
    b = '123';
}

关注 6 回答 6

KiritoXF 回答了问题 · 1月26日

解决ts报错2304找不到名称

那个没引进来吧

import { Iobj } from './interface.ts'

关注 3 回答 3

KiritoXF 关注了问题 · 1月26日

typescript, 是否可以定义一个name为string, 其他属性为number的对象?

typescript, 是否可以定义一个name为string, 其他属性为number的对象?

interface A {
    name: string,
    [key: string]: number
}

想当然了, 这是官方文档中提到的错误:

image.png

请问有什么方法可以做到吗?

关注 4 回答 1

KiritoXF 回答了问题 · 1月25日

sourcetree贮藏功能,只能贮藏一个文件吗?

stash 好像是 git 的功能

  1. 点贮藏的话应该是把本地所有的修改文件都贮藏了
  2. 不需要。如果暂存了的话可以勾选 "贮藏后保持暂存修改"

关注 1 回答 1

认证与成就

  • 获得 64 次点赞
  • 获得 10 枚徽章 获得 1 枚金徽章, 获得 1 枚银徽章, 获得 8 枚铜徽章

擅长技能
编辑

开源项目 & 著作
编辑

(゚∀゚ )
暂时没有

注册于 2018-12-26
个人主页被 1.7k 人浏览