尚硅谷Vue2.0+Vue3.0全套教程丨vuejs从入门到精通 学习笔记

时间:2024-12-19 22:15:07

有两个版本,开发版本和发布版本

vue tool ,网页编译工具,用在网页上进行

beta 测试版本

是一对象,包含vue的全局哦欸之,可以在启动应用之前修改下列的属性

productionTip类型默认值,可以去除一种提示

,设置是否是生产环境

阻止vue在启动时生成生产提示

一、初识vue

1、想让vue工作,就必须创建一个vue实例,且要传入一个配置对象

2、root容器里的代码依然遵循html规范,只不过混入一些特殊的vue语法

3、root容器中的代码被称为root模板

 

注意区分js表达式和js代码块

1、表达式:一个表达式会是一个值,可以放在任何一个需要的地方

(1)a

(2)a+b

2、代码语句块

if、for等

二、编写一个vue实例

el 用于指定vue实例为哪个容器服务,值通常为css选择器或者类选择器

data中用于存储数据,通常会使用类选择器

 

三、vue的三种语句,插值语法和指令语法

差值语法动态的指定标签属性是有问题的,需要使指令语法

 赋值语法:用于解析标签体内容

指令语法:用于解析标签(包括:标签属性、标签体内容、绑定事件)

 

四、vue数据绑定

V-bind 单向数据改变

V-model 双向数据绑定(只能作用在表单元素中)

使用方式

v-bind:value =“name”  缩写  :value = "name"

v-model:value="name" 缩写  v-model = "name",因为其默认作用在value属性中

输入类元素

五、vue示例介绍

 带有$符号表示是让程序员用的

 使用v.$mount绑定容器

六、data的几种实现方式

 函数式的缩写

 

 注意不要使用箭头函数

 七、MVVM模型

 

 

 data中的所有属性,最终都出现在vm身上

vm身上所有的属性及vue原型上所有属性,在vue模板中都可以直接使用

八、数据代理

 

 方法

配置一些属性

 设置getter、setter方法

 

数据代理的定义:通过一个对象代理对另一个对象中属性的操作