美文网首页
1、Vue.js起步

1、Vue.js起步

作者: 1只念旧的兔子 | 来源:发表于2019-03-06 17:09 被阅读0次

1.Vue.js是什么

Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合。另一方面,当与现代化的工具链以及各种支持类库结合使用时,Vue 也完全能够为复杂的单页应用提供驱动。
Vue.js入门教程

Vue.js.png
Vue.js的特性:
  • 1.轻量级的框架

  • 2.双向数据绑定

  • 3.指令

  • 4.插件化
    前端三大马车:
    1.Vue 2. Angular 3. React

2.MVX框架模式

MVX框架模式:MVC+MVP+MVVM

1.MVC:Model(模型)+View(视图)+controller(控制器),主要是基于分层的目的,让彼此的职责分开。
View通过Controller来和Model联系,Controller是View和Model的协调者,View和Model不直接联系,基本联系都是单向的。
用户User通过控制器Controller来操作模板Model从而达到视图View的变化。

2.MVP:是从MVC模式演变而来的,都是通过Controller/Presenter负责逻辑的处理+Model提供数据+View负责显示。
在MVP中,Presenter完全把View和Model进行了分离,主要的程序逻辑在Presenter里实现。
并且,Presenter和View是没有直接关联的,是通过定义好的接口进行交互,从而使得在变更View的时候可以保持Presenter不变。
MVP模式的框架:Riot,js。

3.MVVM:MVVM是把MVC里的Controller和MVP里的Presenter改成了ViewModel。Model+View+ViewModel。
View的变化会自动更新到ViewModel,ViewModel的变化也会自动同步到View上显示。
这种自动同步是因为ViewModel中的属性实现了Observer,当属性变更时都能触发对应的操作。
MVVM模式的框架有:AngularJS+Vue.js和Knockout+Ember.js后两种知名度较低以及是早起的框架模式。

3.现代的前端开发模式

前端开发绝不仅仅写HTML和CSS
新的概念:ES6、Node.js、npm、前端工程化、SPA、组件化开发等,新的东西在不断优化我们的开发模式,改变我们的编程思想。

4.Vue.js起步练习

使用Vue.js的两种方式:

  • 通过引入CDN后直接使用或者下载后使用(较为简单)
  • 使用命令行工具CLI搭建脚手架去编写对应的内容
    页面起步步骤:
    1.引入图中的script代码,将Vue.js引入到我们的项目中并可以使用
    Script代码.png
    2.起步页面:
    起步页面.png
    注意点:
  • data用于数据的存储,可以设置对应的数据,data的值也是一个对象,类型可以是字符串、number、对象、数组。
  • el代表element,指需要获取的元素,一定是html中的根容器元素

相关文章

  • Vue起步

    Vue.js官网 Vue.js教程 1. Vue.js起步 Vue.js有两种方式:引入CDN方式或使用命令行工具...

  • 1、Vue.js起步

    1.Vue.js是什么 Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架。与其...

  • 1、Vue.js起步

    1.vue是什么? Vue.js官网Vue.js菜鸟教程 2.MVVM模式 MVVM即:Model-View-Vi...

  • 1 Vue.js起步

    1 Vue.js是什么 简单小巧的渐进式技术栈,可以一步一步、有阶段性地来使用Vue.js,不必一开始就使用所有的...

  • 1 Vue.js起步

    1. Vue前端框架 2. MVVM模式 view和view-model之间通过双向绑定data-binding建...

  • 1、Vue.js起步学习

    Vue.js的官网定义:渐进式JavaScript框架 前端三个框架:Augular React VueMVVM...

  • 1. Vue.js起步

    1.简介 Vue.js(读音 /vjuː/, 类似于 view)是一个构建数据驱动的 web 界面的渐进式框架。V...

  • Vue.js起步

    1、什么是Vue 1.Vue的详解 2.Vue的用途 2、Vue.js起步 1.首先需要安装好HBuilderX,...

  • Vue.js第1课-起步

    一、Vue.js 实现 HelloWorld 先来看一个简单地用 Vue.js 实现的 HelloWorld 例子...

  • Vue.js 起步

    每个Vue应用都需要通过实例化Vue实现。语法格式如下: 接下来让我们通过实例来看下Vue构造器中需要哪些内容:实...

网友评论

      本文标题:1、Vue.js起步

      本文链接:https://www.haomeiwen.com/subject/hxhxpqtx.html