素材巴巴 > 程序开发 >

邂逅 Vuejs(一)

程序开发 2023-09-13 08:02:08

邂逅 Vuejs

简单认识 Vuejs

  • Vue有很多特点和Web开发中常见的高级功能

  • 学习Vuejs的前提?

  • Vue.js 安装

  • 方式二:下载和引入

  • 方式三:NPM安装

  • Hello Vuejs

  • 浏览器执行代码的流程:

  • 并且,目前我们的代码是可以做到响应式的。

    在这里插入图片描述

  • Vue 列表显示

  • HTML代码中,使用v-for指令

  • 是不是变得So Easy,我们再也不需要在JavaScript代码中完成DOM的拼接相关操作了

  • 而且,更重要的是,它还是响应式的。

    在这里插入图片描述

  • 案例:计数器

  • 这里,我们又要使用新的指令和属性了

  • 你可能会疑惑?

  • 这些疑惑在后续学习中都会一一解开。

  • Vue 中的 MVVM

    在这里插入图片描述

  • Model层:数据层

  • ViewModel层:视图模型层

  • 计数器的MVVM

  • 它们之间如何工作呢?

  • 有了Vue帮助我们完成ViewModel层的任务,在后续的开发,我们就可以专注于数据的处理,以及DOM的编写工作了。

  • 创建Vue实例传入的options

  • 目前掌握这些选项:

  • data:

  • methods:


  • 标签:

    上一篇: 关于页面自适应浏览器宽高 下一篇:
    素材巴巴 Copyright © 2013-2021 http://www.sucaibaba.com/. Some Rights Reserved. 备案号:备案中。