VUE3.0学习笔记

由于笔者最近的项目，需要用到Vue和原生混编。之前没有写过Vue只有React的开发经验
所以写一篇文章来记录一下学习过程，也在学习的你遇到问题也可以给我私信我们交流一下遇到的问题

Vue的学习笔记

什么是Vue

Vue是一款用于构建用户界面的 JavaScript 框架，它基于标准 HTML、CSS 和 JavaScript 构建，并提供了一套声明式的、组件化的编程模型。

Vue的核心功能

声明式渲染： Vue 基于标准 HTML 拓展了一套模板语法，使得我们可以声明式地描述最终输出的 HTML 和 JavaScript 状态之间的关系。

响应性：Vue 会自动跟踪 JavaScript 状态并在其发生变化时响应式地更新 DOM

渐进式框架

1. 无需构建步骤，渐进式增强静态的 HTML
2. 在任何页面中作为 Web Components 嵌入
3. 单页应用 (SPA)
4. 全栈 / 服务端渲染 (SSR)
5. Jamstack / 静态站点生成 (SSG)
6. 开发桌面端、移动端、WebGL，甚至是命令行终端中的界面

单文件组件

这里贴一个例子

<script setup>
import { ref } from 'vue'
const count = ref(0)
script>

<template>
  <button @click="count++">Count is: {{ count }}button>
template>

<style scoped>
button {
  font-weight: bold;
}
style>
1
2
3
4
5
6
7
8
9
10
11
12
13
14

创建并安装cli脚手架

npm create vue@latest

模版语法

1. v-html: =‘’

2. v-bind:id=‘’

3. v-show:

4. v-if / v- else if / v- else

5. v-model

6. v-for

7. v- on

生命周期