vue提供了一整套前端解决方案，可以提升企业开发效率

vue的处理过程

app.js

项目入口，所有请求最先进入此模块进行处理

route.js

由app.js调用，处理路由的分发

controller.js

处理各种业务

model.js

执行增删改查crud（create、read、update、delete）

MVC

即model（M）、html（V）、route、controller（c）

MVVM

VM是连接M和V的中介角色，VM提供了数据的双向绑定，作为view的html展示数据时需要调用VM，VM调用model取数据再返回给html，html需要操作数据则调用VM，VM调用model来完成对数据的增删改查

创建vue对象

vue不需要调用类似inser的js方法将数据插入dom元素，你只需要指定需要dom元素的class或id，然后指定数据，它会自动对元素所包含的内容中的任何具有插值表达式的地方进行填充。下面是一个简单的示例：

<script src="Scripts/vue-2.4.0.js"></script>
<body>
    <div id="app">
        {{msg}} //插值表达式，可以写vue对象中的data的任何变量，也即只有绑定了vue对象的html元素，它内部才可以使用插值表达式，否则会被当成纯文本输出
    </div>
</body>
<script type="text/javascript">
    var vm = new Vue({ //vue对象就是MVVM中的VM中介者
        el: "#app",
        data: { //data里可以自定义任意的多个变量
            msg:"hello world!" //model
        }
    });
</script>

Javascript - 学习总目录

Javascript - Vue - vue对象的更多相关文章

  1. javascript 及 vue 中的变量前面的美元符号 $ 是什么意思

    $ 您会注意到,我们将库代理为以美元符号“$”为前缀的属性名. 你可能还看过其他的属性和方法,例如,$refs, $on, $mount等等也都是以”$”开头. 虽然属性名上添加前缀不是必须的,但是这 ...

  2. vue修改对象的属性值后页面不重新渲染

    原文地址:vue修改对象的属性值后页面不重新渲染 最近项目在使用vue,遇到几次修改了对象的属性后,页面并不重新渲染,场景如下: HTML页面如下: [html] view plain copy &l ...

  3. 用TypeScript开发Vue——如何通过vue实例化对象访问实际ViewModel对象

    用TypeScript开发Vue--如何通过vue实例化对象访问实际ViewModel对象 背景 我个人很喜欢TypeScript也很喜欢Vue,但在两者共同使用的时候遇到一个问题. Vue的实例化对 ...

  4. Vue实例对象的数据选项

    前面的话 一般地,当模板内容较简单时,使用data选项配合表达式即可.涉及到复杂逻辑时,则需要用到methods.computed.watch等方法.本文将详细介绍Vue实例对象的数据选项 data ...

  5. 创建Vue.js对象：我的第一个Vue.js输出信息

    <!DOCTYPE html><html><head><meta charset=”utf-8″><title>Vue第一条信息</t ...

  6. Vue实例对象的数据选项（火柴）

    前言 一般地,当模板内容比较简单的时候,使用data选项配合表达式即可.涉及到复杂逻辑时,则需要用到methods.computed.watch等方法.本文将详细介绍Vue实例对象的数据选项. dat ...

  7. Vue源码学习二 ———— Vue原型对象包装

    Vue原型对象的包装 在Vue官网直接通过 script 标签导入的 Vue包是 umd模块的形式.在使用前都通过 new Vue({}).记录一下 Vue构造函数的包装. 在 src/core/in ...

  8. vue - vue

    一.vue - 介绍 vue的作者叫尤雨溪,中国人.自认为很牛逼的人物,也是我的崇拜之神. 关于他本人的认知,希望大家读一下这篇关于他的文章,或许你会对语言,技术,产生浓厚的兴趣.https://mp ...

  9. vue - vue基础/vue核心内容

    终于算是顺利进入vue了,确实也只有学了过后才知道,之前三过vue而不学,确实是对的,现在进来了一点都不后悔,ajax.node.js.promise.webpack.git等等确实是除了三大基础外还 ...

随机推荐

  1. 启动Tomcat 卡在 Initializing Spring FrameworkServlet 'SpringMVC'

    使用Myeclipse进行项目开发时莫名其妙启动项目卡在 Initializing Spring FrameworkServlet 'SpringMVC' ,然后等待几分钟后项目才启动起来. 在之前也 ...

  2. process.tar.gz

    exec1.c #include <stdio.h> #include <unistd.h> int main() { char *arglist[3]; arglist[0] ...

  3. kali 安装使用 sslocal

    shadowsocks 1.安装 shadowsocks apt-get install python-pip sudo pip install shadowsocks 2.配置 shadowsock ...

  4. Daily Scrum 11.1

    今天放假一天,明天又是新的一周,预计开始Alpha版本所有功能的整合和优化,争取在两天内完成各种功能的整合. Member Task on 11.1 Task on 11.2 仇栋民 放假一天 开始T ...

  5. Beta冲刺——day2

    Beta冲刺--day2 作业链接 Beta冲刺随笔集 github地址 团队成员 031602636 许舒玲(队长) 031602237 吴杰婷 031602220 雷博浩 031602134 王龙 ...

  6. k8s 使用 traefik 将clusterIP的 svc 暴露服务的方法

    0. 前置条件 安装好k8s.. traefik的简介图 1. 安装 traefik 方法: 创建一个目录 并且存放部分文件等. mkdir /traefik cd /traefik git clon ...

  7. 2013长春网赛1004 hdu 4762 Cut the Cake

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=4762 题意:有个蛋糕,切成m块,将n个草莓放在上面,问所有的草莓放在同一块蛋糕上面的概率是多少.2 & ...

  8. SSM项目POST中文乱码解决方案

    在本地搞了一个SSM的项目练手,修改数据的时候,提交中文数据后居然乱码了.网上一顿狂搜,最终花了几个小时终于解决. 遂加以记录,以便不时之需. 就这么个表单,如果提交中文修改就会乱码,首先确定项目和数 ...

  9. Redis Cluster机器内存充爆处理

    机器配置 系统:CentOS6.7 配置:4C8G 应用:Redis Cluster,实例化 现象 1.无法启动redis,启动后系统OOM,直接杀死 2.Redis: OOM command not ...

  10. c#public、private、protected、internal、protected internal

    public 公有访问.不受任何限制.private 私有访问.只限于本类成员访问,子类,实例都不能访问.protected 保护访问.只限于本类和子类访问,实例不能访问.internal 内部访问. ...