1.什么是框架

成品功能
可以直接使用
规范化编程

2.核心特点

组件化
数据绑定
路由导航管理【页面切换跳转】
共享数据
服务器化

3.原理——MVM模式

View——Viewmodel——model

视图——视图模型——数据模型

网页页面——视图和数据之间连接桥梁【Vue】——数据【数据库或者文件】

Vue的作用

监听变化和事件触发——去进行数据双向关联

4.基本结构

创建Vue对象——进行相关业务的统一处理

var vueapp = Vue.createApp({
	Vue处理的业务内容
        
})

需要将Vue对象关联或者挂在到页面标签上

var vm = vueapp.mount("关联的标签所对应的选择权【推荐id】")

5.Vue提供的技术

Vue如何去帮我们处理业务或者Vue提供了那些技术来帮我们处理业务

data：方法，用于定义Vue中的属性变量
computed：计算数据，数据变动处理
watch：监听属性，用户监控属性的变化，做出相应的处理
methods：方法/函数，用于管理所有的函数
component：组件的定义，自定义组件【自定模块页面】
template：模板，用于定义初始化内容

6.data选项

1.定义

一个函数，通过函数的返回值来进行数据获取

返回值：是一个对象，返回的对象用于定义我们的组件所需要的属性变量

2.语法

var vueapp=Vue.createApp({
	return{
		//定义你需要的属性
	}

})

备注：

定义属性的语法：
属性名：属性初始值
多个属性用，隔开
属性的类型：JS所支持的所有的类型
Vue为了方便获取对象中的信息单独使用，自动将自己的模块信息打包成属性对象：\$模块名字
获取data里面的属性：挂载后返回的对象的对象名.\$data.属性名

7.页面显示数据的方式

1.显示数据

vue提供页面动态显示数据的方式

语法：

{{显示的内容}}

显示内容的分类：

常量数据
变量数据
表达式

例如：

常量：{{"你好"}}
<br>
变量：{{num}}
<br>
运算表达式：
<br>
&nbsp;&nbsp;&nbsp;&nbsp;基本运算：{{12*12}}
<br>
&nbsp;&nbsp;&nbsp;&nbsp;比较运算：{{12>12}}

2.控制显示【指令】

vue指令是干什么的？

vue提供的一些v一开头用的数据绑定的特殊代码，主要用来实现数据与页面的关联【封装原生DOM的操作过程】

vue提供的指令有：

v-model：数据模型的绑定，文本框信息与变量属性双向绑定【只对input标签信息有效】
语法：
    <input type="text" v-model="属性变量名">
v-bind：用于绑定其他处理input的值以外的属性的动态值的绑定控制数据的显
    <标签名 v-bind:标签属性名="属性变量值">
v-if,v-else-if,v-else
    <标签名 v-if="条件表达式或者逻辑表达式">
    注意：
        组合方式
            v-if
            v-if,v-else
            v-if,多个v-else-if
            v-if,多个v-else-if,v-else
        使用方式
            组合使用的标签之间必须连接
循环：v-for
    语法：<标签 v-for="(val,key,index) in 对象/数组/整数">
事假处理：v-on
显示掩藏数据的指令：v-show

Vue指令+基本模块