第四周（10.7-10.13）学习笔记 24软工陈奕君

学习收获：

1.学习了开始学习了Vue，目前快速过了一遍Vue2和Ajex，现在深学Vue3

学习笔记：

Vue:

import { createApp } from 'https://unpkg.com/vue@3/dist/vue.esm-browser.js'

v-for:

作用：列表渲染，遍历容器的元素

语法：v-for="(item, index) in items" :key="index.id"

注意：想让哪个标签遍历展示多次，指令就加在哪个标签上

v-bind:

场景：动态为标签属性绑定值（插值表达式，不能在标签内使用）

语法：v-bind：属性=“变量”或者：属性=“变量”

v-if：

语法：v-if="表达式"，表达式值为 true，显示；false，隐藏

原理：基于条件判断，来控制创建或移除元素节点（条件渲染）

场景：要么显示，要么不显示，不频繁切换的场景

其它：可以配合 v-else-if /v-else 进行链式调用条件判断

v-show

语法：v-show="表达式"，表达式值为 true，显示；false，隐藏

原理：基于 CSS 样式 display 来控制显示与隐藏

场景：频繁切换显示隐藏的场景

v-model

作用：表单元素上进行双向数据绑定，用于获取或设置表单项数据

注意：v-model="变量"，变量必须在 data 中声明

v-on

作用：事件绑定

语法：v-on:click="..." / @click="..."

Ajex:

介绍：Asynchronous JavaScript And XML，异步的 JavaScript 和 XML

作用：

数据交换：通过 Ajax 可以给服务器发送请求，并获取服务器响应的数据。

异步交互：可以在不重新加载整个页面的情况下，与服务器交换数据并更新部分网页的技术，如：搜索、用户名是否可用的校验等等。