小丁的博客

Vue 3 保留了所有 Vue 2 的核心模板语法，包括。，其作用机制与 Vue 2 完全一致。：直接操作真实 DOM 的添加/移除。切换CSS的display属性。：如页面初始化时的模块按需加载。：每次展示都是全新状态的场景。避免隐藏时仍需维护状态。// 安全的数据更新流程。// 等待 DOM 更新。

此处的响应式是指：数据模型发生变化时，自动更新DOM树内容，页面上显示的内容会进行同步变化，vue3的数据模型不是自动响应式的（Vue2中默认是响应式的），需要我们做一些特殊的处理

@click.once:只触发一次事件。[重点]@click.prevent:阻止默认事件。[重点]@click.stop:阻止事件冒泡@click.capture:使用事件捕获模式而不是冒泡模式@click.self:只在事件发送者自身触发时才触发事件

想要渲染一个元素的attribute，应该使用v-bind指令由于插值表达式不能直接放在标签的属性中，所有要渲染元素的属性就应该使用v-bindv-bind可以用于渲染任何元素的属性，语法为 v-bind:属性名='数据名'，可以简写为 :属性名='数据名'

插值表达式是将数据 渲染 到元素的指定位置的手段之一插值表达式 不绝对依赖标签，其位置相对自由插值表达式中支持javascript的 运算表达式插值表达式中也支持 函数的调用

在Vue3中，浏览器会先加载和解析index.html文件，然后再执行main.js里的代码。这是因为index.html是HTML文档的入口点，而main.js是JavaScript文件，在index.html中通过script标签引入。当浏览器解析index.html时，会从上到下逐行执行HTML和JavaScript代码，并且遇到script标签时会先加载并执行其中的代码。因此，即使在main.js中编写了Vue3代码，也必须通过在index.html中引入main.js来启动应用程序，并且必须等到i

使用IDEA创建Vue3通过Vite实现工程化

Vue3和原始DOM操作的主要区别在于，Vue3是一个MVVM框架，它将视图和数据分离开来，提供了一种声明式的方式来管理视图和数据之间的关系。而原始DOM操作则是直接操作浏览器的DOM元素，需要手动处理视图和数据之间的关系。