Xiuji957

使用Express完善Crawler项目结构如下 1234567891011121314151617181920├── data│   └── movie.json├── index.html├── node_modules│   ├── @types│   │   ├── body-parser -> ../.pnpm/@types+body-parser@1.19.2/node_modules/@types/body-parser│   │   ├── express -> ../.pnpm/@types+express@4.17.17/node_modules/@types/express│   │   └── node -> ../.pnpm/@types+node@20.4.2/node_modules/@types/node│   ├── body-parser -> .pnpm/body-parser@1.20.2/node_modules/body-parser│   └── express -> .pnpm/express@4.18.2/ ...

联合类型和类型保护使用ts断言进行类型保护12345678910111213141516171819202122232425262728interface Dog { canRun: boolean; bark: () => {};}interface Cat { canRun: boolean; miaow: () => {};}/** * @Description: 使用断言进行类型保护，解决联合类型的问题 * @Author: * @param {Dog | Cat} animal 形参animal的类型是联合类型，只要满足其中一个类型即可 * @return {*} * @Date: 2023-08-08 14:04:42 */function testAnimal(animal: Dog | Cat) { // animal.miaow(); // 类型“dog”上不存在属性“miaow”。ts(2339 ...

Ts实现基础的爬虫安装项目需要的依赖 12pnpm i superagentpnpm i cheerio 起步 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123/* * @Description: * @Author: xiuji * @Date: 2023-07-05 16:54:21 * @LastEditTime: 2023-08-01 14:09:15 * @LastEditors: Do not edit */import fs from 'fs'; // nodejs自带的文件模块imp ...

TypeScript相比JavaScript的优势 ts是js的超集，存在类型的脚本语言 强大的类型系统，拥有静态类型检查能力 新增类型注解和类型推断 拥有丰富的class扩展功能 编译期进行类型检查 开发环境能提供丰富的信息 大部分检查有语言自身完成 基础类型和对象类型12345678910111213141516171819202122// 基础类型 number string boolean void null undefined symbolconst count: number = 123;const studentName: string = "neo";// 数组类型const numbers: number[] = [1, 2, 3];// 对象类型 {} Class function []type Student = { name: string, age: number}const student: Student = { name: "neo", a ...

起步项目中安装router Vue3安装router4版本Vue2安装router3版本 1pnpm i vue-router -S 项目src目录下新建router文件夹，新建index.ts 123456789101112131415161718192021222324252627282930/* * @Description: * @Author: xiuji * @Date: 2023-04-25 10:57:56 * @LastEditTime: 2023-04-25 16:11:59 * @LastEditors: Do not edit */import { createRouter, createWebHistory, RouteRecordRaw } from 'vue-router'const routes = <RouteRecordRaw[]> [ { path: "/", name: "Home", comp ...

Pinia和Vuex都有刷新页面状态会丢失的问题 Pinia通过自定义一个pinia插件实现数据持久化 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748/* * @Description: * @Author: xiuji * @Date: 2022-07-12 16:30:05 * @LastEditTime: 2023-04-19 16:24:15 * @LastEditors: Do not edit */import { createApp, toRaw } from 'vue'import { createPinia, PiniaPluginContext } from 'pinia'const store = createPinia()// 定义兜底变量const __storageKey = 'pinia'type Options = { ...

$reset重置重置store到初始状态 123456state: () => { return { user: <Result> {}, name: '占位', } }, 组件中修改name的状态 1234const changeName = () => { store.name = '用户名'}store.$reset() 调用$reset可以将state中的所有参数重置回原始状态 $subscribe订阅类似于Vuex 的abscribe 只要有state 的变化就会走这个函数 123store.$subscribe((args,state)=>{ console.log(args,state);}) 返回值： 在组件卸载之后继续调用请设置第二个参数： 1234567store.$subscribe((args, state ...

GettersGetter 完全等同于 Store 状态的 计算值。 它们可以用 defineStore() 中的 getters 属性定义。 他们接收“状态”作为第一个参数以鼓励箭头函数的使用： 123456789101112131415161718192021222324252627282930313233/* * @Description: store * @Author: xiuji * @Date: 2023-04-12 16:39:54 * @LastEditTime: 2023-04-14 16:02:07 * @LastEditors: Do not edit */import { defineStore } from 'pinia'import { StoreName } from './index-name'export const useStore = defineStore(StoreName.main, { state: () => { ...

请注意，store 是一个用reactive 包裹的对象，这意味着不需要在getter 之后写.value，但是，就像setup 中的props 一样，我们不能对其进行解构： 12345678910111213141516171819202122232425262728293031323334353637383940<!-- * @Description: * @Author: xiuji * @Date: 2022-11-20 09:14:30 * @LastEditTime: 2023-04-14 15:44:58 * @LastEditors: Do not edit--><template> <div class="content"> <h2> <!-- {{ store.bikini }}--{{ store.count }} --> {{ count }&# ...

State 是允许直接修改值的123456789101112131415161718192021222324252627282930<!-- * @Description: * @Author: xiuji * @Date: 2022-11-20 09:14:30 * @LastEditTime: 2023-04-14 15:02:36 * @LastEditors: Do not edit--><template> <div class="content"> {{ store.count }} <!-- store中参数已经是响应式数据 --> <button @click="store.count++">addCount</button> </div></template><script setup lang="ts">import { use ...