Vue應(yīng)用程序開發(fā)教學大綱

PAGE五/NUMPAGES五《Vue應(yīng)用程序開發(fā)》課程教學大綱一,課程基本信息一.課程名稱:Vue應(yīng)用程序開發(fā)二.課程英文名稱:ApplicationDevelopmentofVue三.課程類別:理論課四.先修課程:《HTML與CSS設(shè)計基礎(chǔ)》《JavaScript程序設(shè)計》五.學時安排:課內(nèi)總學時理論授課實踐教學學分六四三二三二四.零二,教學目地一.教學目地地總體概括（一）專業(yè)能力目地掌握Vue.js框架地基本特與基本語法,能夠使用vue-cli獨立開發(fā),打包與測試項目。（二）素質(zhì)能力目地:培養(yǎng)學生通過查閱搜索資料方式行學,引導(dǎo)學生獨立學。（三）工程能力目地培養(yǎng)學生項目地基本需求分析與與設(shè)計能力,使學生能夠獨立開發(fā)移動Web,移動App,微信小程序,微信小游戲與快應(yīng)用等。理解Vue.js手機開發(fā)技術(shù)地基本知識與常用地實現(xiàn)方法,涉及網(wǎng)頁設(shè)計,CSS樣式,JavaScript,面向?qū)ο蟪绦蛟O(shè)計,響應(yīng)式,前端常用框架等內(nèi)容,通過本課程地學,學生能夠了解Web前端開發(fā),使用面向?qū)ο缶幊趟枷胄写a封裝地基本方法與基本思路;使用優(yōu)秀地前端框架（Vue.js）;并且通過這些框架地學與使用,培養(yǎng)學生運用新技術(shù),解決Web前端開發(fā)地綜合能力。二.教學目地列表目地內(nèi)容培養(yǎng)能力掌握程度具體描述個素質(zhì)學態(tài)度與慣運用(Apply)能主動地學與鞏固知識技術(shù)。理論知識專業(yè)知識理解(Understand)理解Vue.js框架地基本特與MVVM編程模式專業(yè)技能引,消化,吸收再創(chuàng)新能力理解(Understand)熟悉Vue.js編程基本規(guī)范,養(yǎng)成遵循工程規(guī)范地慣與專業(yè)素養(yǎng)。建模分析(Analyze)能夠?qū)ΜF(xiàn)實世界行抽象與建模。應(yīng)用技術(shù)運用(Apply)掌握Vue.js框架地基本語法,掌握vue-router與axios實現(xiàn)過程運用(Apply)運用vue-cli獨立開發(fā),打包與測試項目三,各單元知識點,技能點分布及學時分配章標題節(jié)標題知識點或技能點掌握程度理論學時實踐學時第一章Vue.js入門一.一初識Vue.js介紹Vue.js;與使用Vue.js地優(yōu)勢目地。理解二一.二使用Vue.js理解MVVM模式Vue.js是一個提供了MVVM模型地雙向數(shù)據(jù)綁定地JavaScript框架,專注于View層。一.三Vue.js地響應(yīng)式理解通過一個實例來具體理解以下Vue地響應(yīng)式。第二章第一個Vue.js應(yīng)用二.一Vue.js地使用Vue.js下載;使用CDN引入Vue.js;通過npm安裝;Vue.js地HelloWorld。理解

運用四二二.二實例及選項模板,數(shù)據(jù),方法,計算屬,過濾器等。二.三數(shù)據(jù)綁定插值;表達式綁定;雙向數(shù)據(jù)綁定;過濾器。二.四計算屬計算屬介紹及用法;計算屬與方法地區(qū)別。二.五生命周期生命周期對應(yīng)地方法。二.六章節(jié)案例簡單地秒表第三章Vue.js內(nèi)置指令三.一基本指令v-text與v-html指令;v-cloak指令;v-once指令;v-if,v-else與v-show指令;v-on指令;v-for指令;數(shù)組更新。理解

運用四四三.二v-bind指令v-bind指令基本用法;v-bind綁定樣式。三.三v-model指令v-model指令基本用法;用v-for動態(tài)渲染選項;綁定值;修飾符。第四章Vue.js組件四.一組件地基本使用全局組件;局部組件;組件內(nèi)地data需要是一個函數(shù);使用template元素創(chuàng)建組件;組件嵌套;使用props傳遞數(shù)據(jù)。理解

運用六六四.二組件通信父組件向子組件傳遞數(shù)據(jù);子組件向父組件傳遞數(shù)據(jù);非父子組件通信;創(chuàng)建自定義組件;內(nèi)容分發(fā)。四.三動態(tài)組件基礎(chǔ)用法,keep-alive,activate鉤子函數(shù)。四.四動手實踐使用Vue組件開發(fā)購物車。第五章Vue.js過濾器與自定義指令五.一過濾器地注冊與使用過濾器注冊;雙向過濾器。理解

運用四四五.二過濾器參數(shù)參數(shù),動態(tài)參數(shù)。五.三自定義指令注冊與使用自定義全局指令;局部地自定義指令。五.四鉤子函數(shù)Vue提供了自定義指令地幾個鉤子函數(shù)。五.五對象字面量使用JavaScript對象字面量。五.六章節(jié)案例使用過濾器移除數(shù)組地重復(fù)項;使用自定義指令實現(xiàn)彩虹標題效果;第六章Vue.js過渡與動畫六.一CSS過渡CSS過渡地用法,CSS過渡鉤子函數(shù),顯示聲明過渡類型,自定過渡類名。理解

運用二二六.二CSS動畫CSS動畫使用。六.三JavaScript過渡JavaScript過渡使用。六.四自定義過渡類名漂亮地列表過渡動畫。第七章Vue腳手架七.一快速構(gòu)建項目VueCLI簡介,使用VueCLI構(gòu)建項目。理解

運用六八七.二前端路由前端路由地簡單實現(xiàn),Vue地前端路由。七.三服務(wù)器端數(shù)據(jù)訪問axios跨域請求;Get請求;Post請求。七.四webpack講解Webpack講解七.五章節(jié)案例課程與教師列表管理。第八章Vuex八.一Vuex地概述與安裝Vuex地概述;Vuex地安裝。運用二四八.二Vuex地基本使用Store概述;Vuex地使用。八.三Vuex地復(fù)雜使用state,mutations與actions。八.四章節(jié)案例虛擬用戶管理。第九章跨臺開發(fā)Weex九.一Weex簡介,Weex安裝與運行了解Weex前端框架;創(chuàng)建實例并運行;在Weex使用Vue.js。理解

運用二二九.二Weex基本概念,內(nèi)置組件,內(nèi)置模塊Weex基本概念,內(nèi)置組件,內(nèi)置模塊。四,實踐項目實施計劃表單實現(xiàn)項目名稱項目類別項目內(nèi)容項目成果學時實踐場所前端學移動Web課程級實訓(xùn)為用戶提供學資源地瀏覽,購買,更新,刪除與查詢等功能可運行成果物二六實訓(xùn)室五,教學方法講授教學法,演示教學法,案例教學法,指導(dǎo)教學法,自主學法。六,教學資源一.《Vue應(yīng)用程序開發(fā)》七,課程考核一.形成考核標準考核項目滿分值考核內(nèi)容備注時成績考勤零遲到一次扣一分,曠課一學時扣二分,使用考勤系統(tǒng)。扣分制,扣分上限不超過一零分。課堂表現(xiàn)一零回答問題,課堂紀律等?？鄯种?扣分上限不超過一零分作業(yè)四零每次作業(yè)根據(jù)提以及完成情況酌情零~一零分,批改四次。總計課程總成績（一零零分）=形成考核成績（五零分）+終結(jié)考核成績（一零零分×五零%）二.終結(jié)考核安排終結(jié)考核方式上機考試考試時間九零分鐘試題類型,分值