Web全栈开发案例教程课件 第7章 Vue基础.pptxVIP

Web全栈开发案例教程

第7章Vue.js前端开发

内容简介最简单的Vue程序一vue绑定数据实现动态效果二v-if和v-for指令三vue中的事件处理四vue组件的注册和使用三五

7.1Vue使用基础Vue.js是一套用于Web前端开发的JavaScript渐进式框架。Vue通过虚拟DOM技术来避免对DOM的直接操作；通过尽可能简单的API来实现响应式的数据绑定，并支持单向和双向数据绑定。。Vue的核心是数据驱动和视图组件。Vue.js采用MVVM（Model-ViewModel-Model）模式，将前端代码分离为视图和数据两部分，从而不需要直接操作DOM。

7.1.1引入Vue3.xVue的官方网站是/，在该网站上单击“安装”链接方式1：CDN方式引入scriptsrc=/vue@3/dist/vue.global.js/script方式2：下载下来再引入scriptsrc=./js/vue.js/script Vue3.x和Vue2.x完全不兼容。Vue2.x程序的特征是用newVue({})声明Vue实例

第一个Vue程序divid=app{{msg}}/divscriptconst{createApp}=VuecreateApp({data(){return{msg:HelloVue }}}).mount(#app)/sc