第十四单元(认识单页面应用,理解vue-router的基本用法) #课程目标 1.了解单页应用与多页应用以及各自的优缺点 2.掌握路由如何实现单页应用 3.精通路由的基本语法 #知识点 #一.单页应用与多页应用 1.多页应用(MPA) 传统的应用形式,即每一次页面跳转的时候,后台服务器都会给返回一个新的html文档,这种类型的网站也就是多页网站,也叫做多页应用. 2.单页应用(SPA) 第一次进入页面的时候会请求一个html文件,刷新清除一下.切换到其他组件,此时路径也相应变化,但是并没有新的h…
第四单元(初识vue-在页面中直接引入vue框架-学习使用vue语法-vue的指令-介绍data用法-methods用法) #课程目标 了解 vue 框架的特点 掌握创建 vue 实例 掌握 data 用法及特点 掌握 vue 基本指令的用法 掌握 methods 用法 #知识点 直接用 <script> 引入,Vue 会被注册为一个全局变量.  创建vue实例,并将实例挂载到window上. <body> <div id='app'> <h1>{{msg}…
第十四单元(react路由-react路由的跳转以及路由信息) #课程目标 理解前端单页面应用与多页面应用的优缺点 理解react路由是前端单页面应用的核心 会使用react路由配置前端单页面应用框架及实现页面之间的跳转 认识react路由元信息,学会从react路由元信息中拿到所需要的路由信息 会使用react路由传参,及通过传参实现页面之间数据的传递 #知识点 react路由库,react-dom(react-router-dom+react-router-native)或者react-ro…
第十四单元 Linux网络原理及基础设置 三种网卡模式图 使用ifconfig命令来维护网络 ifconfig命令的功能 ifconfig命令的用法举例 使用ifup和ifdown命令启动和停止网卡 ifup命令的功能 ifdown命令的功能 ifup命令的用法举例 ifdown命令的用法举例 网络配置文件 网卡对应的网络配置文件 什么是网络配置 ip命令 ping命令 setup命令 课后作业 [本节内容]1. 使用ifconfig命令来维护网络(详见linux系统管理P422)1) 掌握if…
第十八单元(单向数据流 vuex状态管理) #课程目标 1.理解什么是数据管理模式 2.什么是vuex 3.什么时候使用vuex 4.vuex安装及工作原理 5.vuex语法 #知识点 1.首先来看下图示例,当我们想实现A->D组件的通信时 需要A先跟B通信,B跟C通信,C再跟D通信,过程很繁琐,数据传输很麻烦. graph LR; A组件-->B组件 B组件-->C组件 C组件-->D组件   而下图则是最简单的数据管理模式,也就是说A可以跟一个store进行通信,而同时D也跟s…
前言:关于页面上的知识点,如有侵权,请看 这里 . 关键词:SPA.单个 HTML 文件.全靠 JS 操作.Virtual DOM.hash/history api 路由跳转.ajax 响应.按需加载.MVVM SPA 我们先来看一下在百科上面的解释吧,emmmm,一般呢,我每次搜索一些不懂的词,都会习惯先去看百科里面的解释,反正我从来都不奢望能看懂,只是指望有个大概的框架的,哈哈~ "单页面应用(SPA:single-page application),就是只有一张Web页面的应用,是加载单个…
第十九单元(mapState mapMutations等方法的使用) #课程目标 1.熟练使用mapState 2.熟练使用mapGetters 3.熟练使用mapActions 4.熟练使用mapMutations #知识点 首先在讲解用法前我们先创建一个仓库实例 import Vue from 'vue' import Vuex from 'vuex' import {Mockurl} from '@/until' Vue.use(Vuex) export default new Vuex.…
第十六单元(element-ui vue-lazyload 等常用插件) #课程目标 1.掌握插件的引入方式 2.精通UI框架 3.掌握前端常见的几种效果实现 #知识点 一.elementUI的使用 1.官网:https://element.eleme.cn/#/zh-CN/ ​ elementUI是pc端框架,配合vue使用. 2.安装 npm i element-ui -S   3.快速上手 ​ (1)完整引入 ​ 在 main.js 中写入以下内容: import Vue from 'vu…
第十五单元(熟练使用vue-router插件) #课程目标 1.掌握路由嵌套 2.掌握导航守卫 #知识点 #一.路由嵌套 很多时候,我们会在一个视口中实现局部页面的切换.这时候就需要到了嵌套路由. 也就是说一个被渲染组件同样可以包含自己的嵌套 <router-view>. const router = new VueRouter({ routes: [ { path: '/cinema', //电影 component: Cinema, children: [ { path: 'hot', /…
第十二单元(vue中过渡效果的实现) #课程目标 熟练掌握transition组件的用法 熟练使用transition组件做过渡特效 熟练使用transition组件做动画特效 了解使用transition组件自定义过渡的类名 #知识点 #1.过渡简介 Vue 在插入.更新或者移除 DOM 时,提供多种不同方式的应用过渡效果.Vue 提供了内置的过渡封装组件,该组件用于包裹要实现过渡效果的组件. 语法格式: <transition name = "nameoftransition"…