吴光慧11.4学习笔记

.vscode/settings.json

@@ -0,0 +1,3 @@
+{
+    "Codegeex.RepoIndex": true
+}

吴光慧学习笔记/11.1/hello_vue3/node_modules/.vite/deps/_metadata.json

@@ -1,15 +0,0 @@
-{
-  "hash": "46b0222b",
-  "configHash": "bd95fc18",
-  "lockfileHash": "fb215960",
-  "browserHash": "f337cd4d",
-  "optimized": {
-    "vue": {
-      "src": "../../vue/dist/vue.runtime.esm-bundler.js",
-      "file": "vue.js",
-      "fileHash": "70a0ad66",
-      "needsInterop": false
-    }
-  },
-  "chunks": {}
-}

吴光慧学习笔记/11.1/hello_vue3/node_modules/.vue-global-types/vue_3.5_0.d.ts

@@ -1,137 +0,0 @@
-// @ts-nocheck
-export {};
-
-; declare global {
-	const __VLS_directiveBindingRestFields: { instance: null, oldValue: null, modifiers: any, dir: any };
-	const __VLS_unref: typeof import('vue').unref;
-	const __VLS_placeholder: any;
-
-	type __VLS_NativeElements = __VLS_SpreadMerge<SVGElementTagNameMap, HTMLElementTagNameMap>;
-	type __VLS_IntrinsicElements = import('vue/jsx-runtime').JSX.IntrinsicElements;
-	type __VLS_Element = import('vue/jsx-runtime').JSX.Element;
-	type __VLS_GlobalComponents = import('vue').GlobalComponents;
-	type __VLS_GlobalDirectives = import('vue').GlobalDirectives;
-	type __VLS_IsAny<T> = 0 extends 1 & T ? true : false;
-	type __VLS_PickNotAny<A, B> = __VLS_IsAny<A> extends true ? B : A;
-	type __VLS_SpreadMerge<A, B> = Omit<A, keyof B> & B;
-	type __VLS_WithComponent<N0 extends string, LocalComponents, Self, N1 extends string, N2 extends string, N3 extends string> =
-		N1 extends keyof LocalComponents ? { [K in N0]: LocalComponents[N1] } :
-		N2 extends keyof LocalComponents ? { [K in N0]: LocalComponents[N2] } :
-		N3 extends keyof LocalComponents ? { [K in N0]: LocalComponents[N3] } :
-		Self extends object ? { [K in N0]: Self } :
-		N1 extends keyof __VLS_GlobalComponents ? { [K in N0]: __VLS_GlobalComponents[N1] } :
-		N2 extends keyof __VLS_GlobalComponents ? { [K in N0]: __VLS_GlobalComponents[N2] } :
-		N3 extends keyof __VLS_GlobalComponents ? { [K in N0]: __VLS_GlobalComponents[N3] } :
-		{};
-	type __VLS_FunctionalComponentCtx<T, K> = __VLS_PickNotAny<'__ctx' extends keyof __VLS_PickNotAny<K, {}>
-		? K extends { __ctx?: infer Ctx } ? NonNullable<Ctx> : never : any
-		, T extends (props: any, ctx: infer Ctx) => any ? Ctx : any
-	>;
-	type __VLS_FunctionalComponentProps<T, K> = '__ctx' extends keyof __VLS_PickNotAny<K, {}>
-		? K extends { __ctx?: { props?: infer P } } ? NonNullable<P> : never
-		: T extends (props: infer P, ...args: any) => any ? P
-		: {};
-	type __VLS_FunctionalComponent<T> = (props: (T extends { $props: infer Props } ? Props : {}) & Record<string, unknown>, ctx?: any) => __VLS_Element & {
-		__ctx?: {
-			attrs?: any;
-			slots?: T extends { $slots: infer Slots } ? Slots : Record<string, any>;
-			emit?: T extends { $emit: infer Emit } ? Emit : {};
-			props?: (T extends { $props: infer Props } ? Props : {}) & Record<string, unknown>;
-			expose?: (exposed: T) => void;
-		};
-	};
-	type __VLS_IsFunction<T, K> = K extends keyof T
-		? __VLS_IsAny<T[K]> extends false
-		? unknown extends T[K]
-		? false
-		: true
-		: false
-		: false;
-	type __VLS_NormalizeComponentEvent<
-		Props,
-		Emits,
-		onEvent extends keyof Props,
-		Event extends keyof Emits,
-		CamelizedEvent extends keyof Emits,
-	> = __VLS_IsFunction<Props, onEvent> extends true
-		? Props
-		: __VLS_IsFunction<Emits, Event> extends true
-			? { [K in onEvent]?: Emits[Event] }
-			: __VLS_IsFunction<Emits, CamelizedEvent> extends true
-				? { [K in onEvent]?: Emits[CamelizedEvent] }
-				: Props;
-	// fix https://github.com/vuejs/language-tools/issues/926
-	type __VLS_UnionToIntersection<U> = (U extends unknown ? (arg: U) => unknown : never) extends ((arg: infer P) => unknown) ? P : never;
-	type __VLS_OverloadUnionInner<T, U = unknown> = U & T extends (...args: infer A) => infer R
-		? U extends T
-		? never
-		: __VLS_OverloadUnionInner<T, Pick<T, keyof T> & U & ((...args: A) => R)> | ((...args: A) => R)
-		: never;
-	type __VLS_OverloadUnion<T> = Exclude<
-		__VLS_OverloadUnionInner<(() => never) & T>,
-		T extends () => never ? never : () => never
-	>;
-	type __VLS_ConstructorOverloads<T> = __VLS_OverloadUnion<T> extends infer F
-		? F extends (event: infer E, ...args: infer A) => any
-		? { [K in E & string]: (...args: A) => void; }
-		: never
-		: never;
-	type __VLS_NormalizeEmits<T> = __VLS_PrettifyGlobal<
-		__VLS_UnionToIntersection<
-			__VLS_ConstructorOverloads<T> & {
-				[K in keyof T]: T[K] extends any[] ? { (...args: T[K]): void } : never
-			}
-		>
-	>;
-	type __VLS_EmitsToProps<T> = __VLS_PrettifyGlobal<{
-		[K in string & keyof T as `on${Capitalize<K>}`]?:
-			(...args: T[K] extends (...args: infer P) => any ? P : T[K] extends null ? any[] : never) => any;
-	}>;
-	type __VLS_ResolveEmits<
-		Comp,
-		Emits,
-		TypeEmits = {},
-		NormalizedEmits = __VLS_NormalizeEmits<Emits> extends infer E ? string extends keyof E ? {} : E : never,
-	> = __VLS_SpreadMerge<NormalizedEmits, TypeEmits>;
-	type __VLS_ResolveDirectives<T> = {
-		[K in keyof T & string as `v${Capitalize<K>}`]: T[K];
-	};
-	type __VLS_PrettifyGlobal<T> = { [K in keyof T as K]: T[K]; } & {};
-	type __VLS_WithDefaultsGlobal<P, D> = {
-		[K in keyof P as K extends keyof D ? K : never]-?: P[K];
-	} & {
-		[K in keyof P as K extends keyof D ? never : K]: P[K];
-	};
-	type __VLS_UseTemplateRef<T> = Readonly<import('vue').ShallowRef<T | null>>;
-	type __VLS_ProxyRefs<T> = import('vue').ShallowUnwrapRef<T>;
-
-	function __VLS_getVForSourceType<T extends number | string | any[] | Iterable<any>>(source: T): [
-		item: T extends number ? number
-			: T extends string ? string
-			: T extends any[] ? T[number]
-			: T extends Iterable<infer T1> ? T1
-			: any,
-		index: number,
-	][];
-	function __VLS_getVForSourceType<T>(source: T): [
-		item: T[keyof T],
-		key: keyof T,
-		index: number,
-	][];
-	function __VLS_getSlotParameters<S, D extends S>(slot: S, decl?: D):
-		D extends (...args: infer P) => any ? P : any[];
-	function __VLS_asFunctionalDirective<T>(dir: T): T extends import('vue').ObjectDirective
-		? NonNullable<T['created' | 'beforeMount' | 'mounted' | 'beforeUpdate' | 'updated' | 'beforeUnmount' | 'unmounted']>
-		: T extends (...args: any) => any
-			? T
-			: (arg1: unknown, arg2: unknown, arg3: unknown, arg4: unknown) => void;
-	function __VLS_asFunctionalComponent<T, K = T extends new (...args: any) => any ? InstanceType<T> : unknown>(t: T, instance?: K):
-		T extends new (...args: any) => any ? __VLS_FunctionalComponent<K>
-		: T extends () => any ? (props: {}, ctx?: any) => ReturnType<T>
-		: T extends (...args: any) => any ? T
-		: __VLS_FunctionalComponent<{}>;
-	function __VLS_functionalComponentArgsRest<T extends (...args: any) => any>(t: T): 2 extends Parameters<T>['length'] ? [any] : [];
-	function __VLS_asFunctionalElement<T>(tag: T, endTag?: T): (attrs: T & Record<string, unknown>) => void;
-	function __VLS_asFunctionalSlot<S>(slot: S): S extends () => infer R ? (props: {}) => R : NonNullable<S>;
-	function __VLS_tryAsConstant<const T>(t: T): T;
-}

吴光慧学习笔记/11.1/hello_vue3/node_modules/.vue-global-types/vue_99_0.d.ts

@@ -1,137 +0,0 @@
-// @ts-nocheck
-export {};
-
-; declare global {
-	const __VLS_directiveBindingRestFields: { instance: null, oldValue: null, modifiers: any, dir: any };
-	const __VLS_unref: typeof import('vue').unref;
-	const __VLS_placeholder: any;
-
-	type __VLS_NativeElements = __VLS_SpreadMerge<SVGElementTagNameMap, HTMLElementTagNameMap>;
-	type __VLS_IntrinsicElements = import('vue/jsx-runtime').JSX.IntrinsicElements;
-	type __VLS_Element = import('vue/jsx-runtime').JSX.Element;
-	type __VLS_GlobalComponents = import('vue').GlobalComponents;
-	type __VLS_GlobalDirectives = import('vue').GlobalDirectives;
-	type __VLS_IsAny<T> = 0 extends 1 & T ? true : false;
-	type __VLS_PickNotAny<A, B> = __VLS_IsAny<A> extends true ? B : A;
-	type __VLS_SpreadMerge<A, B> = Omit<A, keyof B> & B;
-	type __VLS_WithComponent<N0 extends string, LocalComponents, Self, N1 extends string, N2 extends string, N3 extends string> =
-		N1 extends keyof LocalComponents ? { [K in N0]: LocalComponents[N1] } :
-		N2 extends keyof LocalComponents ? { [K in N0]: LocalComponents[N2] } :
-		N3 extends keyof LocalComponents ? { [K in N0]: LocalComponents[N3] } :
-		Self extends object ? { [K in N0]: Self } :
-		N1 extends keyof __VLS_GlobalComponents ? { [K in N0]: __VLS_GlobalComponents[N1] } :
-		N2 extends keyof __VLS_GlobalComponents ? { [K in N0]: __VLS_GlobalComponents[N2] } :
-		N3 extends keyof __VLS_GlobalComponents ? { [K in N0]: __VLS_GlobalComponents[N3] } :
-		{};
-	type __VLS_FunctionalComponentCtx<T, K> = __VLS_PickNotAny<'__ctx' extends keyof __VLS_PickNotAny<K, {}>
-		? K extends { __ctx?: infer Ctx } ? NonNullable<Ctx> : never : any
-		, T extends (props: any, ctx: infer Ctx) => any ? Ctx : any
-	>;
-	type __VLS_FunctionalComponentProps<T, K> = '__ctx' extends keyof __VLS_PickNotAny<K, {}>
-		? K extends { __ctx?: { props?: infer P } } ? NonNullable<P> : never
-		: T extends (props: infer P, ...args: any) => any ? P
-		: {};
-	type __VLS_FunctionalComponent<T> = (props: (T extends { $props: infer Props } ? Props : {}) & Record<string, unknown>, ctx?: any) => __VLS_Element & {
-		__ctx?: {
-			attrs?: any;
-			slots?: T extends { $slots: infer Slots } ? Slots : Record<string, any>;
-			emit?: T extends { $emit: infer Emit } ? Emit : {};
-			props?: (T extends { $props: infer Props } ? Props : {}) & Record<string, unknown>;
-			expose?: (exposed: T) => void;
-		};
-	};
-	type __VLS_IsFunction<T, K> = K extends keyof T
-		? __VLS_IsAny<T[K]> extends false
-		? unknown extends T[K]
-		? false
-		: true
-		: false
-		: false;
-	type __VLS_NormalizeComponentEvent<
-		Props,
-		Emits,
-		onEvent extends keyof Props,
-		Event extends keyof Emits,
-		CamelizedEvent extends keyof Emits,
-	> = __VLS_IsFunction<Props, onEvent> extends true
-		? Props
-		: __VLS_IsFunction<Emits, Event> extends true
-			? { [K in onEvent]?: Emits[Event] }
-			: __VLS_IsFunction<Emits, CamelizedEvent> extends true
-				? { [K in onEvent]?: Emits[CamelizedEvent] }
-				: Props;
-	// fix https://github.com/vuejs/language-tools/issues/926
-	type __VLS_UnionToIntersection<U> = (U extends unknown ? (arg: U) => unknown : never) extends ((arg: infer P) => unknown) ? P : never;
-	type __VLS_OverloadUnionInner<T, U = unknown> = U & T extends (...args: infer A) => infer R
-		? U extends T
-		? never
-		: __VLS_OverloadUnionInner<T, Pick<T, keyof T> & U & ((...args: A) => R)> | ((...args: A) => R)
-		: never;
-	type __VLS_OverloadUnion<T> = Exclude<
-		__VLS_OverloadUnionInner<(() => never) & T>,
-		T extends () => never ? never : () => never
-	>;
-	type __VLS_ConstructorOverloads<T> = __VLS_OverloadUnion<T> extends infer F
-		? F extends (event: infer E, ...args: infer A) => any
-		? { [K in E & string]: (...args: A) => void; }
-		: never
-		: never;
-	type __VLS_NormalizeEmits<T> = __VLS_PrettifyGlobal<
-		__VLS_UnionToIntersection<
-			__VLS_ConstructorOverloads<T> & {
-				[K in keyof T]: T[K] extends any[] ? { (...args: T[K]): void } : never
-			}
-		>
-	>;
-	type __VLS_EmitsToProps<T> = __VLS_PrettifyGlobal<{
-		[K in string & keyof T as `on${Capitalize<K>}`]?:
-			(...args: T[K] extends (...args: infer P) => any ? P : T[K] extends null ? any[] : never) => any;
-	}>;
-	type __VLS_ResolveEmits<
-		Comp,
-		Emits,
-		TypeEmits = Comp extends { __typeEmits?: infer T } ? unknown extends T ? {} : import('vue').ShortEmitsToObject<T> : {},
-		NormalizedEmits = __VLS_NormalizeEmits<Emits> extends infer E ? string extends keyof E ? {} : E : never,
-	> = __VLS_SpreadMerge<NormalizedEmits, TypeEmits>;
-	type __VLS_ResolveDirectives<T> = {
-		[K in keyof T & string as `v${Capitalize<K>}`]: T[K];
-	};
-	type __VLS_PrettifyGlobal<T> = { [K in keyof T as K]: T[K]; } & {};
-	type __VLS_WithDefaultsGlobal<P, D> = {
-		[K in keyof P as K extends keyof D ? K : never]-?: P[K];
-	} & {
-		[K in keyof P as K extends keyof D ? never : K]: P[K];
-	};
-	type __VLS_UseTemplateRef<T> = Readonly<import('vue').ShallowRef<T | null>>;
-	type __VLS_ProxyRefs<T> = import('vue').ShallowUnwrapRef<T>;
-
-	function __VLS_getVForSourceType<T extends number | string | any[] | Iterable<any>>(source: T): [
-		item: T extends number ? number
-			: T extends string ? string
-			: T extends any[] ? T[number]
-			: T extends Iterable<infer T1> ? T1
-			: any,
-		index: number,
-	][];
-	function __VLS_getVForSourceType<T>(source: T): [
-		item: T[keyof T],
-		key: keyof T,
-		index: number,
-	][];
-	function __VLS_getSlotParameters<S, D extends S>(slot: S, decl?: D):
-		D extends (...args: infer P) => any ? P : any[];
-	function __VLS_asFunctionalDirective<T>(dir: T): T extends import('vue').ObjectDirective
-		? NonNullable<T['created' | 'beforeMount' | 'mounted' | 'beforeUpdate' | 'updated' | 'beforeUnmount' | 'unmounted']>
-		: T extends (...args: any) => any
-			? T
-			: (arg1: unknown, arg2: unknown, arg3: unknown, arg4: unknown) => void;
-	function __VLS_asFunctionalComponent<T, K = T extends new (...args: any) => any ? InstanceType<T> : unknown>(t: T, instance?: K):
-		T extends new (...args: any) => any ? __VLS_FunctionalComponent<K>
-		: T extends () => any ? (props: {}, ctx?: any) => ReturnType<T>
-		: T extends (...args: any) => any ? T
-		: __VLS_FunctionalComponent<{}>;
-	function __VLS_functionalComponentArgsRest<T extends (...args: any) => any>(t: T): 2 extends Parameters<T>['length'] ? [any] : [];
-	function __VLS_asFunctionalElement<T>(tag: T, endTag?: T): (attrs: T & Record<string, unknown>) => void;
-	function __VLS_asFunctionalSlot<S>(slot: S): S extends () => infer R ? (props: {}) => R : NonNullable<S>;
-	function __VLS_tryAsConstant<const T>(t: T): T;
-}

吴光慧学习笔记/11.1/hello_vue3/node_modules/vite/types/customEvent.d.ts

@@ -1,45 +0,0 @@
-import type {
-  ErrorPayload,
-  FullReloadPayload,
-  PrunePayload,
-  UpdatePayload,
-} from './hmrPayload'
-
-export interface CustomEventMap {
-  'vite:beforeUpdate': UpdatePayload
-  'vite:afterUpdate': UpdatePayload
-  'vite:beforePrune': PrunePayload
-  'vite:beforeFullReload': FullReloadPayload
-  'vite:error': ErrorPayload
-  'vite:invalidate': InvalidatePayload
-  'vite:ws:connect': WebSocketConnectionPayload
-  'vite:ws:disconnect': WebSocketConnectionPayload
-}
-
-export interface WebSocketConnectionPayload {
-  /**
-   * @experimental
-   * We expose this instance experimentally to see potential usage.
-   * This might be removed in the future if we didn't find reasonable use cases.
-   * If you find this useful, please open an issue with details so we can discuss and make it stable API.
-   */
-  // eslint-disable-next-line n/no-unsupported-features/node-builtins
-  webSocket: WebSocket
-}
-
-export interface InvalidatePayload {
-  path: string
-  message: string | undefined
-  firstInvalidatedBy: string
-}
-
-/**
- * provides types for payloads of built-in Vite events
- */
-export type InferCustomEventPayload<T extends string> =
-  T extends keyof CustomEventMap ? CustomEventMap[T] : any
-
-/**
- * provides types for names of built-in Vite events
- */
-export type CustomEventName = keyof CustomEventMap | (string & {})

吴光慧学习笔记/11.1/hello_vue3/node_modules/vite/types/hot.d.ts

@@ -1,39 +0,0 @@
-import type { CustomEventName, InferCustomEventPayload } from './customEvent'
-
-export type ModuleNamespace = Record<string, any> & {
-  [Symbol.toStringTag]: 'Module'
-}
-
-export interface ViteHotContext {
-  readonly data: any
-
-  accept(): void
-  accept(cb: (mod: ModuleNamespace | undefined) => void): void
-  accept(dep: string, cb: (mod: ModuleNamespace | undefined) => void): void
-  accept(
-    deps: readonly string[],
-    cb: (mods: Array<ModuleNamespace | undefined>) => void,
-  ): void
-
-  acceptExports(
-    exportNames: string | readonly string[],
-    cb?: (mod: ModuleNamespace | undefined) => void,
-  ): void
-
-  dispose(cb: (data: any) => void): void
-  prune(cb: (data: any) => void): void
-  invalidate(message?: string): void
-
-  on<T extends CustomEventName>(
-    event: T,
-    cb: (payload: InferCustomEventPayload<T>) => void,
-  ): void
-  off<T extends CustomEventName>(
-    event: T,
-    cb: (payload: InferCustomEventPayload<T>) => void,
-  ): void
-  send<T extends CustomEventName>(
-    event: T,
-    data?: InferCustomEventPayload<T>,
-  ): void
-}

吴光慧学习笔记/11.1/hello_vue3/node_modules/vite/types/importMeta.d.ts

@@ -1,30 +0,0 @@
-// This file is an augmentation to the built-in ImportMeta interface
-// Thus cannot contain any top-level imports
-// <https://www.typescriptlang.org/docs/handbook/declaration-merging.html#module-augmentation>
-
-// This is tested in `packages/vite/src/node/__tests_dts__/typeOptions.ts`
-// eslint-disable-next-line @typescript-eslint/no-empty-object-type -- to allow extending by users
-interface ViteTypeOptions {
-  // strictImportMetaEnv: unknown
-}
-
-type ImportMetaEnvFallbackKey =
-  'strictImportMetaEnv' extends keyof ViteTypeOptions ? never : string
-
-interface ImportMetaEnv extends Record<ImportMetaEnvFallbackKey, any> {
-  BASE_URL: string
-  MODE: string
-  DEV: boolean
-  PROD: boolean
-  SSR: boolean
-}
-
-interface ImportMeta {
-  url: string
-
-  readonly hot?: import('./hot').ViteHotContext
-
-  readonly env: ImportMetaEnv
-
-  glob: import('./importGlob').ImportGlobFunction
-}

吴光慧学习笔记/11.1/hello_vue3/package.json

@@ -1,30 +0,0 @@
-{
-  "name": "hello_vue3",
-  "version": "0.0.0",
-  "private": true,
-  "type": "module",
-  "engines": {
-    "node": "^20.19.0 || >=22.12.0"
-  },
-  "scripts": {
-    "dev": "vite",
-    "build": "run-p type-check \"build-only {@}\" --",
-    "preview": "vite preview",
-    "build-only": "vite build",
-    "type-check": "vue-tsc --build"
-  },
-  "dependencies": {
-    "vue": "^3.5.22"
-  },
-  "devDependencies": {
-    "@tsconfig/node22": "^22.0.2",
-    "@types/node": "^22.18.11",
-    "@vitejs/plugin-vue": "^6.0.1",
-    "@vue/tsconfig": "^0.8.1",
-    "npm-run-all2": "^8.0.4",
-    "typescript": "~5.9.0",
-    "vite": "^7.1.11",
-    "vite-plugin-vue-devtools": "^8.0.3",
-    "vue-tsc": "^3.1.1"
-  }
-}

吴光慧学习笔记/11.1/hello_vue3/src/App.vue

@@ -1,33 +0,0 @@
-<template>
-  <div class="person">
-    <h2>姓名：{{name}}</h2>
-    <h2>年龄：{{age}}</h2>
-    <button @click="changeName">修改名字</button>
-    <button @click="changeAge">年龄+1</button>
-    <button @click="showTel">点我查看联系方式</button>
-  </div>
-</template>
-
-<script lang="ts">
-  export default {
-    name:'App',
-    data() {
-      return {
-        name:'张三',
-        age:18,
-        tel:'13888888888'
-      }
-    },
-    methods:{
-      changeName(){
-        this.name = 'zhang-san'
-      },
-      changeAge(){
-        this.age += 1
-      },
-      showTel(){
-        alert(this.tel)
-      }
-    },
-  }
-</script>

吴光慧学习笔记/11.1/hello_vue3/src/components/HelloWorld.vue

@@ -1,41 +0,0 @@
-<script setup lang="ts">
-defineProps<{
-  msg: string
-}>()
-</script>
-
-<template>
-  <div class="greetings">
-    <h1 class="green">{{ msg }}</h1>
-    <h3>
-      You’ve successfully created a project with
-      <a href="https://vite.dev/" target="_blank" rel="noopener">Vite</a> +
-      <a href="https://vuejs.org/" target="_blank" rel="noopener">Vue 3</a>.
-    </h3>
-  </div>
-</template>
-
-<style scoped>
-h1 {
-  font-weight: 500;
-  font-size: 2.6rem;
-  position: relative;
-  top: -10px;
-}
-
-h3 {
-  font-size: 1.2rem;
-}
-
-.greetings h1,
-.greetings h3 {
-  text-align: center;
-}
-
-@media (min-width: 1024px) {
-  .greetings h1,
-  .greetings h3 {
-    text-align: left;
-  }
-}
-</style>

吴光慧学习笔记/11.1/hello_vue3/src/components/TheWelcome.vue

@@ -1,95 +0,0 @@
-<script setup lang="ts">
-import WelcomeItem from './WelcomeItem.vue'
-import DocumentationIcon from './icons/IconDocumentation.vue'
-import ToolingIcon from './icons/IconTooling.vue'
-import EcosystemIcon from './icons/IconEcosystem.vue'
-import CommunityIcon from './icons/IconCommunity.vue'
-import SupportIcon from './icons/IconSupport.vue'
-
-const openReadmeInEditor = () => fetch('/__open-in-editor?file=README.md')
-</script>
-
-<template>
-  <WelcomeItem>
-    <template #icon>
-      <DocumentationIcon />
-    </template>
-    <template #heading>Documentation</template>
-
-    Vue’s
-    <a href="https://vuejs.org/" target="_blank" rel="noopener">official documentation</a>
-    provides you with all information you need to get started.
-  </WelcomeItem>
-
-  <WelcomeItem>
-    <template #icon>
-      <ToolingIcon />
-    </template>
-    <template #heading>Tooling</template>
-
-    This project is served and bundled with
-    <a href="https://vite.dev/guide/features.html" target="_blank" rel="noopener">Vite</a>. The
-    recommended IDE setup is
-    <a href="https://code.visualstudio.com/" target="_blank" rel="noopener">VSCode</a>
-    +
-    <a href="https://github.com/vuejs/language-tools" target="_blank" rel="noopener"
-      >Vue - Official</a
-    >. If you need to test your components and web pages, check out
-    <a href="https://vitest.dev/" target="_blank" rel="noopener">Vitest</a>
-    and
-    <a href="https://www.cypress.io/" target="_blank" rel="noopener">Cypress</a>
-    /
-    <a href="https://playwright.dev/" target="_blank" rel="noopener">Playwright</a>.
-
-    <br />
-
-    More instructions are available in
-    <a href="javascript:void(0)" @click="openReadmeInEditor"><code>README.md</code></a
-    >.
-  </WelcomeItem>
-
-  <WelcomeItem>
-    <template #icon>
-      <EcosystemIcon />
-    </template>
-    <template #heading>Ecosystem</template>
-
-    Get official tools and libraries for your project:
-    <a href="https://pinia.vuejs.org/" target="_blank" rel="noopener">Pinia</a>,
-    <a href="https://router.vuejs.org/" target="_blank" rel="noopener">Vue Router</a>,
-    <a href="https://test-utils.vuejs.org/" target="_blank" rel="noopener">Vue Test Utils</a>, and
-    <a href="https://github.com/vuejs/devtools" target="_blank" rel="noopener">Vue Dev Tools</a>. If
-    you need more resources, we suggest paying
-    <a href="https://github.com/vuejs/awesome-vue" target="_blank" rel="noopener">Awesome Vue</a>
-    a visit.
-  </WelcomeItem>
-
-  <WelcomeItem>
-    <template #icon>
-      <CommunityIcon />
-    </template>
-    <template #heading>Community</template>
-
-    Got stuck? Ask your question on
-    <a href="https://chat.vuejs.org" target="_blank" rel="noopener">Vue Land</a>
-    (our official Discord server), or
-    <a href="https://stackoverflow.com/questions/tagged/vue.js" target="_blank" rel="noopener"
-      >StackOverflow</a
-    >. You should also follow the official
-    <a href="https://bsky.app/profile/vuejs.org" target="_blank" rel="noopener">@vuejs.org</a>
-    Bluesky account or the
-    <a href="https://x.com/vuejs" target="_blank" rel="noopener">@vuejs</a>
-    X account for latest news in the Vue world.
-  </WelcomeItem>
-
-  <WelcomeItem>
-    <template #icon>
-      <SupportIcon />
-    </template>
-    <template #heading>Support Vue</template>
-
-    As an independent project, Vue relies on community backing for its sustainability. You can help
-    us by
-    <a href="https://vuejs.org/sponsor/" target="_blank" rel="noopener">becoming a sponsor</a>.
-  </WelcomeItem>
-</template>

吴光慧学习笔记/11.1/hello_vue3/src/main.ts

@@ -1,6 +0,0 @@
-import './assets/main.css'
-
-import { createApp } from 'vue'
-import App from './App.vue'
-
-createApp(App).mount('#app')

吴光慧学习笔记/11.1/hello_vue3/tsconfig.app.json

@@ -1,12 +0,0 @@
-{
-  "extends": "@vue/tsconfig/tsconfig.dom.json",
-  "include": ["env.d.ts", "src/**/*", "src/**/*.vue"],
-  "exclude": ["src/**/__tests__/*"],
-  "compilerOptions": {
-    "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
-
-    "paths": {
-      "@/*": ["./src/*"]
-    }
-  }
-}

吴光慧学习笔记/11.1/hello_vue3/vite.config.ts

@@ -1,18 +0,0 @@
-import { fileURLToPath, URL } from 'node:url'
-
-import { defineConfig } from 'vite'
-import vue from '@vitejs/plugin-vue'
-import vueDevTools from 'vite-plugin-vue-devtools'
-
-// https://vite.dev/config/
-export default defineConfig({
-  plugins: [
-    vue(),
-    vueDevTools(),
-  ],
-  resolve: {
-    alias: {
-      '@': fileURLToPath(new URL('./src', import.meta.url))
-    },
-  },
-})

吴光慧学习笔记/11.1/study/node_modules/.vue-global-types/vue_3.5_0.d.ts

@@ -5,10 +5,9 @@ export {};
 	const __VLS_directiveBindingRestFields: { instance: null, oldValue: null, modifiers: any, dir: any };
 	const __VLS_unref: typeof import('vue').unref;
 	const __VLS_placeholder: any;
+	const __VLS_intrinsics: import('vue/jsx-runtime').JSX.IntrinsicElements;
 
-	type __VLS_NativeElements = __VLS_SpreadMerge<SVGElementTagNameMap, HTMLElementTagNameMap>;
-	type __VLS_IntrinsicElements = import('vue/jsx-runtime').JSX.IntrinsicElements;
-	type __VLS_Element = import('vue/jsx-runtime').JSX.Element;
+	type __VLS_Elements = __VLS_SpreadMerge<SVGElementTagNameMap, HTMLElementTagNameMap>;
 	type __VLS_GlobalComponents = import('vue').GlobalComponents;
 	type __VLS_GlobalDirectives = import('vue').GlobalDirectives;
 	type __VLS_IsAny<T> = 0 extends 1 & T ? true : false;
@@ -31,7 +30,7 @@ export {};
 		? K extends { __ctx?: { props?: infer P } } ? NonNullable<P> : never
 		: T extends (props: infer P, ...args: any) => any ? P
 		: {};
-	type __VLS_FunctionalComponent<T> = (props: (T extends { $props: infer Props } ? Props : {}) & Record<string, unknown>, ctx?: any) => __VLS_Element & {
+	type __VLS_FunctionalComponent<T> = (props: (T extends { $props: infer Props } ? Props : {}) & Record<string, unknown>, ctx?: any) => import('vue/jsx-runtime').JSX.Element & {
 		__ctx?: {
 			attrs?: any;
 			slots?: T extends { $slots: infer Slots } ? Slots : Record<string, any>;

吴光慧学习笔记/11.1/study/node_modules/.vue-global-types/vue_99_0.d.ts

@@ -5,10 +5,9 @@ export {};
 	const __VLS_directiveBindingRestFields: { instance: null, oldValue: null, modifiers: any, dir: any };
 	const __VLS_unref: typeof import('vue').unref;
 	const __VLS_placeholder: any;
+	const __VLS_intrinsics: import('vue/jsx-runtime').JSX.IntrinsicElements;
 
-	type __VLS_NativeElements = __VLS_SpreadMerge<SVGElementTagNameMap, HTMLElementTagNameMap>;
-	type __VLS_IntrinsicElements = import('vue/jsx-runtime').JSX.IntrinsicElements;
-	type __VLS_Element = import('vue/jsx-runtime').JSX.Element;
+	type __VLS_Elements = __VLS_SpreadMerge<SVGElementTagNameMap, HTMLElementTagNameMap>;
 	type __VLS_GlobalComponents = import('vue').GlobalComponents;
 	type __VLS_GlobalDirectives = import('vue').GlobalDirectives;
 	type __VLS_IsAny<T> = 0 extends 1 & T ? true : false;
@@ -31,7 +30,7 @@ export {};
 		? K extends { __ctx?: { props?: infer P } } ? NonNullable<P> : never
 		: T extends (props: infer P, ...args: any) => any ? P
 		: {};
-	type __VLS_FunctionalComponent<T> = (props: (T extends { $props: infer Props } ? Props : {}) & Record<string, unknown>, ctx?: any) => __VLS_Element & {
+	type __VLS_FunctionalComponent<T> = (props: (T extends { $props: infer Props } ? Props : {}) & Record<string, unknown>, ctx?: any) => import('vue/jsx-runtime').JSX.Element & {
 		__ctx?: {
 			attrs?: any;
 			slots?: T extends { $slots: infer Slots } ? Slots : Record<string, any>;

吴光慧学习笔记/11.3/test1.txt

@@ -0,0 +1,66 @@
+<template>
+  <div class="person">
+    <h2>汽车信息：一辆{{ car.brand }}车，价值{{ car.price }}万</h2>
+    <button @click="changePrice">修改汽车的价格</button>
+    <br>
+    <h2>游戏列表：</h2>
+    <ul>
+      <li v-for="g in games" :key="g.id">{{ g.name }}</li>
+    </ul>
+    <button @click="changeFirstGame">修改第一个游戏的名字</button>
+    <br>
+    <h2>测试:{{ obj.a.b.c }}</h2>
+    <button @click="changeObj">修改第一个游戏的名字</button>
+  </div>
+</template>
+
+<script lang="ts" setup name="Person2">
+  import {reactive, ref} from 'vue'
+  //reative定义对象类型数据
+
+  //数据
+  let car = reactive({brand:'奔驰',price:100})
+  let games = reactive([
+    {id:'a01',name:"王者荣耀"},
+    {id:'a02',name:"王者荣耀1"},
+    {id:'a03',name:"王者荣耀2"}
+  ])
+  let obj = reactive({
+    a:{
+      b:{
+        c:666
+      }
+    }
+  })
+  
+
+  //方法
+  function changePrice(){
+    car.price +=10
+  }
+  function changeFirstGame(){
+    if (games[0]) {
+  games[0].name = '和平精英'
+    }
+  }
+  function changeObj(){
+    obj.a.b.c=999
+
+  }
+ 
+</script>
+
+<style scoped>
+  .person{
+    background-color: aquamarine;
+    box-shadow: 0 0 10px;
+    border-radius: 10px;
+    padding: 20px;
+  }
+  button{
+    margin: 0 5px;
+  }
+  li{
+    font-size: 20px;
+  }
+</style>

吴光慧学习笔记/11.3/test2.txt

@@ -0,0 +1,41 @@
+<template>
+  <div class="person">
+    <h2>姓名：{{ person.name }}</h2>
+    <h2>年龄：{{ person.age }}</h2>
+    <button @click="changeName">修改名字</button>
+    <button @click="changeAge">修改年龄</button>
+   
+  </div>
+</template>
+
+<script lang="ts" setup name="Person2">
+  import {reactive, toRefs,toRef} from 'vue'
+ 
+  //数据
+  let person = reactive({
+    name:'张三',
+    age:18
+  })
+
+  let {name,age} = toRefs(person)
+  let nl = toRef(person , 'age')
+  console.log(nl.value)
+
+  function changeName(){
+    name.value += '~'
+  }
+ 
+  function changeAge(){
+    age.value += 1
+  }
+ 
+</script>
+
+<style scoped>
+  .person{
+    background-color: aquamarine;
+    box-shadow: 0 0 10px;
+    border-radius: 10px;
+    padding: 20px;
+  }
+</style>

吴光慧学习笔记/11.3/test3.txt

@@ -0,0 +1,46 @@
+<template>
+  <div class="person">
+    <!-- 姓：<input type="text" v-bind:value="firstName"></input><br>  单向绑定-->
+    姓：<input type="text" v-model:="firstName"></input><br> <!--双向绑定-->
+    名：<input type="text" :value="lastName"></input><br>
+    全名：<span>{{fullName}}</span>
+  </div>
+</template>
+
+<script lang="ts" setup name="Person2">
+  import {ref,computed, toRefs,toRef} from 'vue'
+  let firstName = ref('zhang')
+  let lastName = ref('san')
+  
+   // 计算属性——只读取，不修改
+  /* let fullName = computed(()=>{
+    return firstName.value + '-' + lastName.value
+  }) */
+
+
+  // 计算属性——既读取又修改
+  let fullName = computed({
+  get() {
+    return firstName.value + '-' + lastName.value;
+  },
+  set(val) {
+    const parts = val.split('-');
+    if (parts[0]) firstName.value = parts[0];
+    if (parts[1]) lastName.value = parts[1];
+  }
+})
+
+  function changeFullName(){
+    fullName.value = 'li-si'
+  }
+ 
+</script>
+
+<style scoped>
+  .person{
+    background-color: aquamarine;
+    box-shadow: 0 0 10px;
+    border-radius: 10px;
+    padding: 20px;
+  }
+</style>

吴光慧学习笔记/11.3/test4.txt

@@ -0,0 +1,33 @@
+<template>
+  <div class="person">
+    <h1>情况一：监视【ref】定义的【基本类型】数据</h1>
+    <h2>当前求和为：{{sum}}</h2>
+    <button @click="changeSum">点我sum+1</button>
+  </div>
+</template>
+
+<script lang="ts" setup name="Person">
+  import {ref,watch} from 'vue'
+  // 数据
+  let sum = ref(0)
+  // 方法
+  function changeSum(){
+    sum.value += 1
+  }
+  // 监视，情况一：监视【ref】定义的【基本类型】数据
+  const stopWatch = watch(sum,(newValue,oldValue)=>{
+    console.log('sum变化了',newValue,oldValue)
+    if(newValue >= 10){
+      stopWatch()
+    }
+  })
+</script>
+
+<style scoped>
+  .person{
+    background-color: aquamarine;
+    box-shadow: 0 0 10px;
+    border-radius: 10px;
+    padding: 20px;
+  }
+</style>

吴光慧学习笔记/11.3/笔记

@@ -0,0 +1,19 @@
+【ref 对比 reactive】
+宏观角度看：
+ref用来定义：基本类型数据、对象类型数据；
+reactive用来定义：对象类型数据。
+
+区别：
+ref创建的变量必须使用.value（可以使用volar插件自动添加.value）。
+自动补充value
+
+reactive重新分配一个新对象，会失去响应式（可以使用Object.assign去整体替换）。
+
+使用原则：
+若需要一个基本类型的响应式数据，必须使用ref。
+若需要一个响应式对象，层级不深，ref、reactive都可以。
+若需要一个响应式对象，且层级较深，推荐使用reactive。
+
+【toRefs 与 toRef】
+作用：将一个响应式对象中的每一个属性，转换为ref对象。
+备注：toRefs与toRef功能一致，但toRefs可以批量转换。

吴光慧学习笔记/11.4/props.txt

@@ -0,0 +1,59 @@
+App.vue
+<template>
+	<Person :list="persons"/>
+</template>
+
+<script lang="ts" setup name="App">
+import Person from './components/Person2.vue'
+import {reactive} from 'vue'
+ import {type Persons} from '@/types'
+
+ let persons = reactive<Persons>([
+  {id:'e98219e12',name:'张三',age:18},
+   {id:'e98219e13',name:'李四',age:19},
+    {id:'e98219e14',name:'王五',age:20}
+  ])
+</script>
+
+<style>
+</style>
+
+
+Perspon.vue
+<template>
+<div class="person">
+<ul>
+  <li v-for="item in list" :key="item.id">
+     {{item.name}}--{{item.age}}
+   </li>
+ </ul>
+</div>
+</template>
+
+<script lang="ts" setup name="Person">
+import {defineProps,withDefaults} from 'vue'
+import {type PersonInter} from '@/types'
+
+// 第一种写法：仅接收
+// const props = defineProps(['list'])
+
+// 第二种写法：接收+限制类型
+// defineProps<{list:Persons}>()
+
+// 第三种写法：接收+限制类型+指定默认值+限制必要性
+let props = withDefaults(defineProps<{list?:PersonInter[]}>(),{
+  list:()=>[{id:'asdasg01',name:'小猪佩奇',age:18}]
+})
+
+//接收list，同时将props保存起来
+// let x = defineProps<{list:Persons}>()
+console.log(props)
+</script>
+
+<style scoped>
+.person{
+  width: 200px;
+  height: 200px;
+  background-color: red;
+}
+</style>

吴光慧学习笔记/11.4/test1.txt

@@ -0,0 +1,73 @@
+watch
+监视`ref`定义的【对象类型】数据：直接写数据名，监视的是对象的【地址值】
+若想监视对象内部的数据，要手动开启深度监视。
+
+注意：
+* 若修改的是`ref`定义的对象中的属性，`newValue` 和 `oldValue` 都是新值，因为它们是同一个对象。
+* 若修改整个`ref`定义的对象，`newValue` 是新值， `oldValue` 是旧值，因为不是同一个对象了。
+ /* 
+    监视，情况一：监视【ref】定义的【对象类型】数据，监视的是对象的地址值，若想监视对象内部属性的变化，需要手动开启深度监视
+    watch的第一个参数是：被监视的数据
+    watch的第二个参数是：监视的回调
+    watch的第三个参数是：配置对象（deep、immediate等等.....） 
+  */
+  watch(person,(newValue,oldValue)=>{
+    console.log('person变化了',newValue,oldValue)
+  },{deep:true})
+  如果加immediate:true，则初始化时就会立即执行一次回调函数
+
+
+  <template>
+  <div class="person">
+    <h1>情况四：监视【ref】或【reactive】定义的【对象类型】数据中的某个属性</h1>
+    <h2>姓名：{{ person.name }}</h2>
+    <h2>年龄：{{ person.age }}</h2>
+    <h2>汽车：{{ person.car.c1 }}、{{ person.car.c2 }}</h2>
+    <button @click="changeName">修改名字</button>
+    <button @click="changeAge">修改年龄</button>
+    <button @click="changeC1">修改第一台车</button>
+    <button @click="changeC2">修改第二台车</button>
+    <button @click="changeCar">修改整个车</button>
+  </div>
+</template>
+
+<script lang="ts" setup name="Person">
+  import {reactive,watch} from 'vue'
+
+  // 数据
+  let person = reactive({
+    name:'张三',
+    age:18,
+    car:{
+      c1:'奔驰',
+      c2:'宝马'
+    }
+  })
+  // 方法
+  function changeName(){
+    person.name += '~'
+  }
+  function changeAge(){
+    person.age += 1
+  }
+  function changeC1(){
+    person.car.c1 = '奥迪'
+  }
+  function changeC2(){
+    person.car.c2 = '大众'
+  }
+  function changeCar(){
+    person.car = {c1:'雅迪',c2:'爱玛'}
+  }
+
+  // 监视，情况四：监视响应式对象中的某个属性，且该属性是基本类型的，要写成函数式
+  /* watch(()=> person.name,(newValue,oldValue)=>{
+    console.log('person.name变化了',newValue,oldValue)
+  }) */
+
+  // 监视，情况四：监视响应式对象中的某个属性，且该属性是对象类型的，可以直接写，也能写函数，更推荐写函数
+  watch(()=>person.car,(newValue,oldValue)=>{
+    console.log('person.car变化了',newValue,oldValue)
+  },{deep:true})
+</script>
+

吴光慧学习笔记/11.4/test2.txt

@@ -0,0 +1,48 @@
+<template>
+  <div class="person">
+    <h1>需求：水温达到50℃，或水位达到20cm，则联系服务器</h1>
+    <h2 id="demo">水温：{{temp}}</h2>
+    <h2>水位：{{height}}</h2>
+    <button @click="changePrice">水温+1</button>
+    <button @click="changeSum">水位+10</button>
+  </div>
+</template>
+
+<script lang="ts" setup name="Person">
+  import {ref,watch,watchEffect} from 'vue'
+  // 数据
+  let temp = ref(0)
+  let height = ref(0)
+
+  // 方法
+  function changePrice(){
+    temp.value += 10
+  }
+  function changeSum(){
+    height.value += 1
+  }
+
+  // 用watch实现，需要明确的指出要监视：temp、height
+  watch([temp,height],(value)=>{
+    // 从value中获取最新的temp值、height值
+    const [newTemp,newHeight] = value
+    // 室温达到50℃，或水位达到20cm，立刻联系服务器
+    if(newTemp >= 50 || newHeight >= 20){
+      console.log('联系服务器')
+    }
+  })
+
+  // 用watchEffect实现，不用
+  const stopWtach = watchEffect(()=>{
+    // 室温达到50℃，或水位达到20cm，立刻联系服务器
+    if(temp.value >= 50 || height.value >= 20){
+      console.log(document.getElementById('demo')?.innerText)
+      console.log('联系服务器')
+    }
+    // 水温达到100，或水位达到50，取消监视
+    if(temp.value === 100 || height.value === 50){
+      console.log('清理了')
+      stopWtach()
+    }
+  })
+</script>

吴光慧学习笔记/11.4/生命周期.txt

@@ -0,0 +1,46 @@
+<template>
+  <div class="person">
+    <h2>当前求和为：{{ sum }}</h2>
+    <button @click="changeSum">点我sum+1</button>
+  </div>
+</template>
+
+<!-- vue3写法 -->
+<script lang="ts" setup name="Person">
+  import { 
+    ref, 
+    onBeforeMount, 
+    onMounted, 
+    onBeforeUpdate, 
+    onUpdated, 
+    onBeforeUnmount, 
+    onUnmounted 
+  } from 'vue'
+
+  // 数据
+  let sum = ref(0)
+  // 方法
+  function changeSum() {
+    sum.value += 1
+  }
+  console.log('setup')
+  // 生命周期钩子
+  onBeforeMount(()=>{
+    console.log('挂载之前')
+  })
+  onMounted(()=>{
+    console.log('挂载完毕')
+  })
+  onBeforeUpdate(()=>{
+    console.log('更新之前')
+  })
+  onUpdated(()=>{
+    console.log('更新完毕')
+  })
+  onBeforeUnmount(()=>{
+    console.log('卸载之前')
+  })
+  onUnmounted(()=>{
+    console.log('卸载完毕')
+  })
+</script>

吴光慧学习笔记/hello_vue3/.vite/deps/_metadata.json

@@ -0,0 +1,8 @@
+{
+  "hash": "bbe4c6f7",
+  "configHash": "3e050436",
+  "lockfileHash": "e95c9a53",
+  "browserHash": "a6e009f7",
+  "optimized": {},
+  "chunks": {}
+}