VUE 从零开始 学习笔记 一

最近刚跳到一个新公司 不是很忙 决定系统的学习一下VUE这个前端框架 参考官方API

好了 废话不多说 开始了

首先 说一下吧 现在很火的主流三大前端框架 Vue，Angular、React， 为什么选择Vue呢 因为它的作者尤雨溪是中国人 所以有中文API文档

其次 这个名字 也太好听了吧 

ok 废话不多少 开始

开始之前呢 首先要有Jquery的基础 熟悉Jquery 的dom和bom 操作

然后再颠覆对Jquery操作dom的认知

对了 学习之前呢 还要有一些es6的基础 

说一点简单的吧

1. let 和 const

　　可能之前了解Jquery的都知道var  但是var 存在一个什么问题呢  变量提升！

这个相信大家都可以看得懂 

那么大家认为 会输出什么的 6 对不对

结果却不是

 

 是10  为什么 变量提升 对

而let 和 const就不会存在这个问题

好 现在整理一下 let  const 和 var  的区别

1.let 和 const 是局部作用域 

2.let 和 const 不会存在变量提升

3. let 和 const 不可重复声明

那let 和 const 有什么区别呢

const 只声明常量

什么意思呢 const 声明一个变量后 不可被改变 赋值 修改

2.模板语法

 

这样 会输出什么呢 

没错 我是张三

注意的是 要用tab键上面的反引号

3. 箭头函数

 

 

 下面是浏览器输出结果

 

 第一个是传统写法 第二个是es6 箭头函数写法 第三个是es6 沙雕的变态写法

ok 相信大家已经掌握了

4.es6 里的对象

 这是js里面一个传统的对象

 

 

下面我们把他改造成箭头函数

 

 

 

 

 

 ok 没有什么问题 mike同学说的很对

但是大家一定发现了一个问题 什么呢 this的指向变了 从当前对象变成了 父级对象 也就是上下文  所以箭头函数会改变this 指向

敲黑板  重点啊

 

 这种写法 被称为单体模式 和第一种function的匿名函数 效果一样 不会发生this的指向改变

 OK 这就差不多了 下面正式学习Vue

 

  首先 我们在项目中引入了 vue.js 这是一种比较简单的方法 如果后期你需要做带项目 可以搭脚手架 引入包

 这就是Vue的核心思想 数据驱动 对 将数据渲染进 DOM 的系统 然后实现数据绑定

需要注意的是el 需要绑定一个对象

绑俩也行

new 两个Vue

可以 但是没必要 我这么讲 你懂吧

 然后 Vue 还可以这么玩

 

 

 

 

 行了 今天就这样吧 今天有点累 睡了睡了