·焱·-CSDN博客

原创 Vue3-笔记005-Vue3生命周期

在vue3中，父组件引入子组件是不需要使用components去注册的，引入组件后可以直接当标签去使用。但是组件名称不能与HTML元素标签名称一样。可以用来获取当前的应用实例。他是个hook，可以返回instance对象。通过createHook函数，传入枚举值LifecycleHooks。setup上就会被注册上这些钩子生命周期。在这个文件中导出生命周期函数。Vue3组合式API，没有。

2024-07-18 12:58:10 209

原创 Vue3-笔记004-计算（computed）与侦听（watch）

004-计算（computed）与侦听（watch）-目录computed基本使用案例购物车案例computed本质（脏值检测机制）computed手写原理watch基本使用案例watch本质watchEffect高级侦听器computed计算属性就是当依赖的属性的值发生变化的时候，才会触发他的更改，如果依赖的值，不发生变化的时候，使用的是缓存中的属性值。基本使用案例<template> <div> <div> 姓：

2024-05-30 17:01:37 1697

原创前端工具-tsc编译器

原因：PowerShell 的默认执行策略是 Restricted，它禁止运行任何脚本和配置文件。故需更改PowerShell的设置来解决遇到的问题。如果使用的nvm等管理工具，每个node下需单独安装Typescript。确保已经安装node，npm等前端基础项。有了这个配置文件，编译直接调用。1. 使用管理者身份运行。

2024-05-17 16:49:56 294

原创 Vue3-笔记003-响应式原理

中，Reflect也被用作一个修饰符（decorator），用于监听DOM元素上的属性变化并将其反映到Vue实例的数据上。当DOM元素的属性发生变化时，Vue会捕获这些变化，并更新相应的数据，从而保持数据和视图的同步。ES6认为，对属性内存的控制、原型链的修改、函数的调用等等，这些都属于底层实现，因此，需要将它们提取出来，形成一个正常的API，并高度聚合到某个对象中，于是就造就了Reflect对象。，直接在一个对象上定义一个新属性，或者修改一个对象的现有属性，不同的是，，如果更新成功，则返回true。

2024-05-17 11:08:55 859

原创 Vue3-笔记002-Ref与Reactive

应用：需要一个变量等同于另一个响应式对象的某个属性，改变这个变量，响应式对象的该属性也同步变化。reactive的数组异步赋值是通过proxy去代理的，直接去赋值会将其覆盖，使其响应式失效，导致页面不去更新。注意：ref和shallowRef不能放在一块书写，会影响shallowRef，使他的值改变，造成视图的更新。只能修改对象的值，所以对于一个非响应式对象数据，是不会更新视图的，只会改变值。如果是深层的数据只会改变值，不会改变视图。如果改变的原始对象是响应式的，则会改变值并更新视图。

2024-05-08 21:35:00 770 1

原创 Vue3-笔记001-概述

Vue 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。另一方面，当与现代化的工具链以及各种支持类库结合使用时，Vue 也完全能够为复杂的单页应用提供驱动。*.vue 文件<template><script><style><template>每个*.vue 文件最多可同时包含一个顶层<template>块。其中的内容会被提取出来并传递给。

2024-05-05 20:52:39 1489

原创 20_01_关于简单的猜数字游戏（自己记录用）

作为第一篇小博客，写个简单的东西，作为记录以及复习用。猜数字小游戏，即给四个不相同的数字，猜中数字及位置显示A，猜中数字位置不对显示B，当为4A时取胜。先看一下成品图第一部分 HTML内容/ / 主要是将页面上需要显示的文字给敲出来，顺手把结构也分一下，比如div，form之类的，最好再设置一个class，方便进行css样式的修改，可以的话，在标签上添加上id，在做js部分的时候可以通过id定位到标签从而获取内容或者修改内容。*[HTML]: <body background="./b

2020-07-11 15:33:15 1569

sawyer_Yan的博客