由于笔者最近的项目,需要用到Vue和原生混编。之前没有写过Vue只有React的开发经验
所以写一篇文章来记录一下学习过程,也在学习的你遇到问题也可以给我私信我们交流一下遇到的问题
Vue的学习笔记
什么是Vue
Vue是一款用于构建用户界面的 JavaScript 框架,它基于标准 HTML、CSS 和 JavaScript 构建,并提供了一套声明式的、组件化的编程模型。
Vue的核心功能
声明式渲染: Vue 基于标准 HTML 拓展了一套模板语法,使得我们可以声明式地描述最终输出的 HTML 和 JavaScript 状态之间的关系。
响应性:Vue 会自动跟踪 JavaScript 状态并在其发生变化时响应式地更新 DOM
渐进式框架
- 无需构建步骤,渐进式增强静态的 HTML
- 在任何页面中作为 Web Components 嵌入
- 单页应用 (SPA)
- 全栈 / 服务端渲染 (SSR)
- Jamstack / 静态站点生成 (SSG)
- 开发桌面端、移动端、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>
创建并安装cli脚手架
npm create vue@latest
模版语法
-
v-html: =‘’
-
v-bind:id=‘’
-
v-show:
-
v-if / v- else if / v- else
-
v-model
-
v-for
-
v- on