m0_61265297的博客

在js中，一个class只能继承自另一个class，若其他类中的方法与属性也想继承，则很麻烦。而在ts中可以使用implements来实现一些类共有方法属性的提取。把他提取出来,implements实现它。此时car和cellphone两个类中都需要有switchRadio方法，不然会报错。新加一个Battery interface，使cellphone类接入而car类不接入。意思就是要让前者满足后面的形状（字段及类型）上述两个类都有一个共同的方法，我们可以使用。

【代码】ts中泛型的嵌套和约束。

【代码】ts 中的type。

常量枚举是⼀种特殊枚举类型，它使⽤ const 关键字定义，在编译时会被内联，避免⽣成⼀些额外的代码。所谓“内联”其实就是 TypeScript 在编译时，会将枚举成员引⽤替换为它们的实际值，⽽不是⽣成额外的枚举对象。这可以减少⽣成的 JavaScript 代码量，并提⾼运⾏时性能。枚举（ enum ）可以定义⼀组命名常量，它能增强代码的可读性，也让代码更好维护。调用函数时传参时没有任何提示，编码者很容易写错字符串内容。并且⽤于判断逻辑的是连续且相关的⼀组值，那此时就特别适合使用枚举。

元组 (Tuple) 是⼀种特殊的数组类型，可以存储固定数量的元素，并且每个元素的类型是已知的且可以不同。元组⽤于精确描述⼀组值的类型，?2，可选类型，加上问号表示，可填可不填。用于定义数组每个元素的类型。3，定义多组简化写法。

【代码】react中生命周期钩子。

2, 在组件jsx导入样式文件时使用 import styles from './xxx.module.css' 导入 代替 import './xxx.css'1, 创建组件样式文件时以 xxx.module.css命名, 例如 Home.module.css 代替 Home.css。如果需要每个组件样式隔离, 在设置组件样式时, 每一个选择器都添加组件根标签选择器, 以区分不同组件中的样式。4, 在xxx.module.css中通过 .yyy{} 设置样式,即为局部样式。

3,createRef形式。

首字母要大写！！！

【代码】React教程（五）——生命周期函数。

打了*号的这个写法，虽然把tableDta取出，然后直接push，但其实所指向的都是一个地址，因此这只改变了这个地址指向的内存数据。但就是因为指向了一个地址，React认为虚拟DOM并没有改变，因此，不会重新渲染页面。这就会导致Table组件的dataSource改变了，但是Table并没有重新渲染。

有两种方式,第一种方式直接写值，第二种方式（第一个参数是原来的值，第二个参数返回一个新的值）

获取到的search是urlencoded编码（即，?id=003&name=消息3）字符串，需要借助querystring解析（querystring.stringify(obj), querystring.parse(str)）。去掉问号用qs.parse(str.slice(1)首先要在最外层使用<BrowserRouter></<BrowserRouter>包裹住所有内容。1,使用params的方式传参。2，使用search传递参数。

路由组件：一般组件：写组件标签时传递了什么，就能收到什么。一般组件：components。路由组件：接收到三个固定的属性。一般组件：路由组件：pages。

一般写在所有路由注册的最下方，当所有路由都无法匹配时，跳转到Redirect指定的路由。

【代码】react 修改默认样式。

【代码】react中ProTable。

但是在这里，{...p}并不是复制对象，因为这里的{}表示括号里面要写js表达式了，所以真正写的还是...p，这里react+babel就允许用展开运算符展开对象，不能随便使用（不能用console.log()查看）,仅仅适用于标签传递数据时。但是在这里，{...todo}并不是复制对象，因为这里的{}表示括号里面要写js表达式了，所以真正写的还是...todo，这里react+babel就允许用展开运算符展开对象，不能随便使用（不能用console.log()查看）,仅仅适用于标签传递数据时。

传的标签体值，在children中，可以直接使用。导航的名字，可以直接写在组件身上。可以给选中导航栏的高亮。封装NavLink组件。

/1.通过React的lazy函数配合import()函数动态加载路由组件 ===> 路由组件代码会被分开打包。//2.通过<Suspense>指定在加载得到路由打包文件前显示一个自定义loading界面。方法1，引入一个加载中的样式组件。方法2，引入一个样式。

, [stateValue]) // 如果指定的是[], 回调函数只会在第一次render()后执行。(1). Effect Hook 可以让你在函数组件中执行副作用操作(用于模拟类组件中的生命周期钩子)第二种，第二个参数填空数组，意味着任何变量发生变化都不会监听，只会在初始化执行一次。return () => { // 在组件卸载前执行。第三种，第二个参数为数组，填一个参数，就是这个参数发生变化都会监听到。第四种,在第一个函数，用返回值，相当于组件卸载前执行，可以做收尾工作。发ajax请求数据获取。

定义类型。

ProTable组件定义类型(和columns定义的类型数据一样，都是定义每一行对象的数据类型)定义columns （定义每一行对象的数据类型）接口（未进行ts定义）接口（ts定义类型）

2.callback是可选的回调函数, 它在状态更新完毕、界面也更新后(render调用后)才被调用。(1). setState(stateChange, [callback])------对象式的setState。(2). setState(updater, [callback])------函数式的setState。(3).如果需要在setState()执行后获取最新的状态数据,1.对象式的setState是函数式的setState的简写方式(语法糖)2，函数式setState。

【代码】使用useState定义的数据提示类型“never”上不存在属性“url”。

【代码】ts中父子组件传参，定义Props类型。