（1）vscode的安装及使用
（2）前端知识-ES6语法知识点
（3）Vue-入门
（4） Vue的生命周期
（5）Vue-Axios的使用
（6）ElemmentUI介绍
（1）vscode的安装及使用
下载地址
Visual Studio Code – Code Editing. Redefined
为方便后续开发，建议安装如下插件
创建项目
vscode 本身没有新建项目的选项，所以要先创建一个空的文件夹，如project_xxxx。
然后打开vscode，再在vscode里面选择 File -> Open Folder 打开文件夹，这样才可以创建项目。
保存工作区
打开文件夹后，选择”文件 -> 将工作区另存为…”，为工作区文件起一个名字，存储在刚才的文件夹下即可
新建文件夹和网页
（2）前端知识-ES6语法知识点
什么是 ECMAScript 6
ECMAScript 6.0（简称 ES6）是 JavaScript 语言的下一代标准， 2015 年 6 月正式发布。它的目标，是使得 JavaScript 语言可以用来编写复杂的大型应用程序，成为企业级开发语言。
基本语法
本部分只学习项目开发中涉及到ES6的最少必要知识，方便项目开发中对代码的理解。
let声明变量
// var 声明的变量没有局部作用域
// let 声明的变量 有局部作用域
{
var a =1 ;
let b =2 ;
}
console .log (a )
console .log (b )//b is not defined
// var 可以声明多次
// let 只能声明一次
var m =1 ;
var m =2 ;
let n =10 ;
let n =20 ;//’n’ has already been declared
console .log (m )
console .log (n )
const声明常量（只读变量）
// 1、声明之后不允许改变
const PI = "3.1415926"
PI = 3 // TypeError: Assignment to constant variable.
// 2、一但声明必须初始化，否则会报错
const MY_AGE // Missing initializer in const declaration
解构赋值
创建 03-解构赋值-数组解构.js
解构赋值是对赋值运算符的扩展。
他是一种针对数组或者对象进行模式匹配，然后对其中的变量进行赋值。
在代码书写上简洁且易读，语义更加清晰明了；也方便了复杂对象中数据字段获取。
//1、数组解构
let a =1 ,b =2 ,c =3
//console.log(a, b, c)
// ES6
let [x ,y ,z ] = [1 ,2 ,3 ]
//console.log(x, y, z)
//2、对象解构
let user = {name: ‘Helen’,age: 18 }
//传统
let name1 =user .name
let age1 =user .age
console .log (name1 ,age1 )
// ES6
let {name ,age } =user //注意：结构的变量必须是user 中的属性
console .log (name ,age )
模板字符串
模板字符串相当于加强版的字符串，用反引号 `，除了作为普通字符串，还可以用来定义多行字符串，还可以在字符串中加入变量和表达式。
//字符串插入变量和表达式。变量名写在 ${} 中，${} 中可以放入 JavaScript 表达式。
let name =”lucy”
let age =20
let info =My name is ${name },I am ${age +1 }
console .log (info )
声明对象简写
//传统方式定义对象
const name =”lucy”
const age =20
const user1 = {name:name ,age:age }
//console.log(user1)
//es6
const user2 = {name ,age }
console .log (user2 )
对象拓展运算符
拓展运算符（…）用于取出参数对象所有可遍历属性然后拷贝到当前对象。
//对象复制
let person1 = {name: “Amy”,age: 15 }
let someone1 = { …person1 }
//console.log(someone1)
//对象合并
let age = {age: 15 }
let name = {name: “Amy”}
let person2 = {…age , …name }
console .log (person2 )
箭头函数
箭头函数提供了一种更加简洁的函数书写方式。基本语法是：
参数 => 函数体
箭头函数多用于匿名函数的定义
//传统方式定义函数
var f1 =function (a ) {
return a
}
//console.log(f1(3))
//es6 使用箭头函数定义
//参数=>函数体
var f2 =a => a
//console.log(f2(4))
使用箭头函数
// 当箭头函数没有参数或者有多个参数，要用 () 括起来。
// 当箭头函数函数体有多行语句，用 {} 包裹起来，表示代码块，
// 当只有一行语句，并且需要返回结果时，可以省略 {} , 结果会自动返回。
var f3 =function (m ,n ) {
return m +n
}
//es6
var f4 = (m ,n )=> m +n
console .log (f4 (4 ,5 ))
（3）Vue-入门
Vue.js 是一款流行的 JavaScript 前端框架，目的是简化 Web 开发。Vue 所关注的核心是 MVC 模式中的视图层，同时，它也能方便地获取数据更新，实现视图与模型的交互。
首先需要引入vue.js ：才能使用vue属性
单向和双向绑定指令：
双向绑定
在双向绑定输入框中输入其他地方也跟着变化：
绑定事件:
点击事件绑定：
Vue：条件指令
Vue-列表渲染（循环指令）
（4） Vue的生命周期
（5）Vue-Axios的使用
axios的作用
axios是独立于vue的一个项目，可以用于浏览器和node.js中发送ajax请求
（6）ElemmentUI介绍
element-ui 是饿了么前端出品的基于 Vue.js的 后台组件库，方便程序员进行页面快速布局和构建
Original: https://blog.csdn.net/dengfengling999/article/details/128392564
Author: dengfengling999
Title: 尚医通-前端Vue学习（九）
原创文章受到原创版权保护。转载请注明出处：https://www.johngo689.com/795513/
转载文章受原作者版权保护。转载请注明原作者出处！