Javascript - Vue - vue对象
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，然后指定数据，它会自动对元素所包含的内容中的任何具有插值表达式的地方进行填充。下面是一个简单的示例：
<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 - Vue - vue对象的更多相关文章
- javascript 及 vue 中的变量前面的美元符号 $ 是什么意思
$ 您会注意到,我们将库代理为以美元符号“$”为前缀的属性名. 你可能还看过其他的属性和方法,例如,$refs, $on, $mount等等也都是以”$”开头. 虽然属性名上添加前缀不是必须的,但是这 ...
- vue修改对象的属性值后页面不重新渲染
原文地址:vue修改对象的属性值后页面不重新渲染 最近项目在使用vue,遇到几次修改了对象的属性后,页面并不重新渲染,场景如下: HTML页面如下: [html] view plain copy &l ...
- 用TypeScript开发Vue——如何通过vue实例化对象访问实际ViewModel对象
用TypeScript开发Vue--如何通过vue实例化对象访问实际ViewModel对象 背景 我个人很喜欢TypeScript也很喜欢Vue,但在两者共同使用的时候遇到一个问题. Vue的实例化对 ...
- Vue实例对象的数据选项
前面的话 一般地,当模板内容较简单时,使用data选项配合表达式即可.涉及到复杂逻辑时,则需要用到methods.computed.watch等方法.本文将详细介绍Vue实例对象的数据选项 data ...
- 创建Vue.js对象：我的第一个Vue.js输出信息
<!DOCTYPE html><html><head><meta charset=”utf-8″><title>Vue第一条信息</t ...
- Vue实例对象的数据选项（火柴）
前言 一般地,当模板内容比较简单的时候,使用data选项配合表达式即可.涉及到复杂逻辑时,则需要用到methods.computed.watch等方法.本文将详细介绍Vue实例对象的数据选项. dat ...
- Vue源码学习二 ———— Vue原型对象包装
Vue原型对象的包装 在Vue官网直接通过 script 标签导入的 Vue包是 umd模块的形式.在使用前都通过 new Vue({}).记录一下 Vue构造函数的包装. 在 src/core/in ...
- vue - vue
一.vue - 介绍 vue的作者叫尤雨溪,中国人.自认为很牛逼的人物,也是我的崇拜之神. 关于他本人的认知,希望大家读一下这篇关于他的文章,或许你会对语言,技术,产生浓厚的兴趣.https://mp ...
- vue - vue基础/vue核心内容
终于算是顺利进入vue了,确实也只有学了过后才知道,之前三过vue而不学,确实是对的,现在进来了一点都不后悔,ajax.node.js.promise.webpack.git等等确实是除了三大基础外还 ...
随机推荐
- 【Beta阶段】第三次Scrum Meeting！
每日任务内容: 本次会议为第三次Scrum Meeting会议~ 由于本次会议项目经理召开时间依旧较晚(晚上12点半),所以在公寓7层召开,女生参与了线上会议,召开时间大家集会10分钟. 队员 昨日完 ...
- NSP4——Network Simulator for P4
NSP4--Network Simulator for P4 一.前言 NSP4旨在为P4开发者,创建一个可视化的P4流表管理及拓扑建立工具,帮助P4开发者,更好的调试自己的P4程序.此开发工具是基于 ...
- ElasticSearch 2 (33) - 信息聚合系列之聚合过滤
ElasticSearch 2 (33) - 信息聚合系列之聚合过滤 摘要 聚合范围限定还有一个自然的扩展就是过滤.因为聚合是在查询结果范围内操作的,任何可以适用于查询的过滤器也可以应用在聚合上. 版 ...
- Eclipse使用较多的快捷键
快速修正:Ctrl+1 单词补全:Alt+/ 快速Outline:Ctrl+O 删除行:Ctrl+D 选中到行末/行首:Shift+End/Home 注释:Ctrl+/ 变为大/小写:Ctrl+Shi ...
- beta 圆桌桌 4
031602111 傅海涛 1.今天进展 后台接口大部分完善,并完成交互 2.存在问题 部分接口不稳定 3.明天安排 完成全部接口的交互 4.心得体会 小问题真多,要一个一个解决 031602115 ...
- php排序学习之-冒泡排序
原理:对一组数据,比较相邻数据的大小,将值小数据在前面,值大的数据放在后面. (以下都是升序排列,即从小到大排列) 举例说明: $arr = array(6, 3, 8, 2, 9, 1); $a ...
- OneZero第三次站立会议（2016.3.23）
会议时间:2016年3月23日 13:00~13:15 会议成员:冉华,张敏,王巍,夏一鸣. 会议目的:汇报前一天工作,全体成员评论并修改. 会议内容:以下为会议插图 1.界面原型方面,夏在统计界面中 ...
- Allowed Letters CodeForces - 1009G（状压思维）
题意: 给出一个字符串 给出几个定点必须是哪个字母(或者是几个字母中的一个) 然后求在满足所有定点后的最小字符串 解析: 没错 这题是暴力 用状压暴力 “a - f” 用”0 - 5“ 这几个数字代 ...
- 【BZOJ2054】疯狂的馒头（并查集，线段树）
[BZOJ2054]疯狂的馒头(并查集,线段树) 题面 BZOJ 然而权限题,随便找个离线题库看看题吧. 题解 线段树就是个暴力,如果数据可以构造就能卡掉,然而不能构造,要不然复杂度瓶颈成为了读入了. ...
- 【NOIP 2018】填数游戏（思考与推导）
题目链接 这道题讲道理还是不错的,因为你需要不断挖掘其中的性质来帮助解题.可惜数据范围开在这里让考试时的我很慌,勉强也就写了$65$分就没了.回忆在考场上,思路是没有错的,就是发掘不够深入,思路还不够 ...