M---Model  （数据）

V---View　　(视图)

VM---VIewModel  (转换器)

VIewModel主要做两件事：

1、把 Model 中的数据绑定到View(视图层)。

2、监听VIew （视图层），把事件，界面操作，回调给Model中的JavaScript中的对象，函数。

View:视图层，前端所说的DOM,通常给用户展示各种信息。

Model:数据层，里面存放着各种数据，有我们写死的固定数据，大多数是从网上请求过来的数据。

VIewModel：视图模型层，它是View和Model的桥梁，一是实现Data Bindings也就是数据绑定，将Model中的数据的改变同步到View中去。二是DOM Listeners,也就是DOM监听，当DOM发生一些事件(点击，滚动，touch等)可以监听到，并且改变对应的Data.

计算器小案例

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Document</title>

</head>

<body>

    <div id="app">

        <h1>当前计数:{{counter}}</h1>

        <!-- <button v-on:click="counter++">+</button>

        <button v-on:click="counter--">-</button> -->

        <button v-on:click='add'>+</button>

        <button v-on:click='sub'>-</button>

    </div>

    <script src="./js/vue.js"></script>

    <script>

        const app = new Vue({

            el: '#app',

            data: {

                counter:

            },

            methods: {

                add: function () {

                    console.log(this.counter);

                    this.counter++

                },

                sub: function () {

                    console.log(this.counter);

                    this.counter--

                }

            }

        })

    </script>

</body>

</html>

vue中的---MVVM(面试必问)的更多相关文章

  1. linux驱动工程面试必问知识点

    linux内核原理面试必问(由易到难) 简单型 1:linux中内核空间及用户空间的区别?用户空间与内核通信方式有哪些? 2:linux中内存划分及如何使用?虚拟地址及物理地址的概念及彼此之间的转化, ...

  2. 互联网公司面试必问的Redis题目

    Redis是一个非常火的非关系型数据库,火到什么程度呢?只要是一个互联网公司都会使用到.Redis相关的问题可以说是面试必问的,下面我从个人当面试官的经验,总结几个必须要掌握的知识点. 介绍:Redi ...

  3. 互联网公司面试必问的mysql题目(下）

    这是mysql系列的下篇,上篇文章地址我附在文末. 什么是数据库索引?索引有哪几种类型?什么是最左前缀原则?索引算法有哪些?有什么区别? 索引是对数据库表中一列或多列的值进行排序的一种结构.一个非常恰 ...

  4. 互联网公司面试必问的mysql题目(上)

    又到了招聘的旺季,被要求准备些社招.校招的题库.(如果你是应届生,尤其是东北的某大学,绝对福利哦) 介绍:MySQL是一个关系型数据库管理系统,目前属于 Oracle 旗下产品.虽然单机性能比不上or ...

  5. 面试必问：JVM类加载机制详细解析

    前言 在Java面试中,简历上有写JVM(Java虚拟机)相关的东西,JVM的类加载机制基本是面试必问的知识点. 类的加载和卸载 JVM是虚拟机的一种,它的指令集语言是字节码,字节码构成的文件是cla ...

  6. 一线大厂Java面试必问的2大类Tomcat调优

    一.前言 最近整理了 Tomcat 调优这块,基本上面试必问,于是就花了点时间去搜集一下 Tomcat 调优都调了些什么,先记录一下调优手段,更多详细的原理和实现以后用到时候再来补充记录,下面就来介绍 ...

  7. python笔记39-unittest框架如何将上个接口的返回结果给下个接口适用(面试必问)

    前言 面试必问:如何将上个接口的返回结果,作为下个接口的请求入参?使用unittest框架写用例时,如何将用例a的结果,给用例b使用. unittest框架的每个用例都是独立的,测试数据共享的话,需设 ...

  8. 高级测试工程师面试必问面试基础整理——python基础（一）（首发公众号：子安之路）

    现在深圳市场行情,高级测试工程师因为都需要对编程语言有较高的要求,但是大部分又没有python笔试机试题,所以面试必问python基础,这里我整理一下python基本概念,陆续收集到面试中python ...

  9. Java面试必问之Hashmap底层实现原理(JDK1.7)

    1. 前言 Hashmap可以说是Java面试必问的,一般的面试题会问: Hashmap有哪些特性? Hashmap底层实现原理(get\put\resize) Hashmap怎么解决hash冲突? ...

随机推荐

  1. 面向对象程序设计（Java） 第4周学习指导及要求

    2019面向对象程序设计(Java)第4周学习指导及要求(2019.9.17-2019.9. 23)  学习目标 掌握类与对象的基础概念,理解类与对象的关系: 掌握对象与对象变量的关系: 掌握预定义类 ...

  2. Wireshark的简单使用

    TCP包 先看一下Wireshark抓到的TCP的包对应的协议层: Frame:对应是物理层,主要是传输bit流. Ethernet:数据链路层,传输数据帧,二层通信主要是通过mac地址. Inter ...

  3. zzulioj - 2600: 有多少天？

    题目链接:http://acm.zzuli.edu.cn/problem.php?id=2600 题目描述 小D同学对日期类的问题很是有兴趣,已知1900-01-01是星期一,那么小D想知道给定两个年 ...

  4. Ultimate Chicken Horse GameProject第二次迭代成果文档

    基于上一次的迭代中的数据结构我们补充了UML图.用例图及状态图. 用例图:           选择游戏地图:玩家可以在本地游戏界面将角色移动到地图门口并按下E进入地图. 进行游戏用例: 选择并摆放道 ...

  5. myeclipse开发工具的简单使用

    一.使用eclipse.myeclipse开发JAVA程序 将程序开发环境和调试环境集合在一起,提高开发效率 1.创建java项目2.创建程序包3.编写JAVA源程序4.运行JAVA程序 二.程序移植 ...

  6. SQL Server 迁移数据库 （二）分离和附加

    分离和附加其实比导入和导出,步骤要少一些,但是数据量大的话,跨服务器拷贝数据文件可能要慢一些 1. 分离数据库 这里最好选择断开链接,断开之前要确保你记得数据库的路径,一般默认都是C:\Program ...

  7. POJ2718Smallest Difference(暴力全排列)

    传送门 题目大意:升序输入十进制数 没有重复 分成两个非空集合 每个集合组成一个数(不能有前导零) 求两个数差的最小值. 题解:全排列...我数组从1开始怎么一直WA...还有这个输入值得学习. 代码 ...

  8. 计时器StopWatch的几种写法

    下面提供三种计时器的写法供大家参考,大家可以自行选择自己钟爱的使用. 写法一(Spring 包提供的计时器): import java.text.NumberFormat; import java.u ...

  9. Mac修改hosts方法

    总有各种各样的原因需要修改hosts文件,那么就来简介下怎么修改.terminal中打开hosts: sudo vim /private/etc/hosts 打开文件后I开启插入模式,在最后一行添加你 ...

  10. jquery easyui datagrid 加载保存好的自定义设置的列属性

    直接附上源代码 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <t ...