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. shell 之while两种写法

    1.while[] #!/bin/dash min= max= while [ $min -le $max ] do echo $min min=`` done 2. while(()) #!/bin ...

  2. [笔记] nice-upload 与 nice-static-server

    1.request 支持流模式,管道流pipe,抓取图片并保存就很方便了 request('https://s.gravatar.com/avatar/184a1f14c759795b94ae1d01 ...

  3. JDOJ 1162 是否闰年

    1162: 是否闰年 https://neooj.com:8082/oldoj/problem.php?id=1162 题目描述 输入一个年份year,求year是否是闰年,如果是闰年输出L,否则输出 ...

  4. webapi跨域实现（CROS、JSONP）

    CROS: /// <summary> /// 支持WebAPI服务器端跨域 /// </summary> public class ServerCrossDomainAttr ...

  5. Linux进程和计划任务管理

    1.笔记: 去掉头部:ps -aux - - no -heade 默认信号:15 强制:9 在命令前些一个nohup不再占用终端 date -s:修改时间 ntpdate pool.ntp.org:同 ...

  6. Xamarin.Forms移动开发系列2：创建和调试

    摘要 本文将介绍如何通过VS2019创建Xamarin.Forms应用程序,以及如何进行调试. 前言 本文介绍Xamarin.Froms应用程序的创建和调试. 开发环境 1.Visual Studio ...

  7. [LeetCode] 286. Walls and Gates 墙和门

    You are given a m x n 2D grid initialized with these three possible values. -1 - A wall or an obstac ...

  8. [LeetCode] 17. Letter Combinations of a Phone Number 电话号码的字母组合

    Given a string containing digits from 2-9inclusive, return all possible letter combinations that the ...

  9. 虚拟路由冗余(VRRP)协议

    1. 前言 VRRP(Virtual Router Redundancy Protocol)协议是用于实现路由器冗余的协议,最新协议在RFC3768中定义,原来的定义RFC2338被废除,新协议相对还 ...

  10. Spring Boot 知识笔记（集成zookeeper）

    一.本机搭建zookeeper伪集群 1.下载安装包,复制三份 2.每个安装包目录下面新建一个data文件夹,用于存放数据目录 3.安装包的conf目录下,修改zoo.cfg配置文件 # The nu ...