Vue 知识整理—02-起步
一：Vue 语法格式：
vue vm = new Vue({
//选项
})
二：Vue 实例：
<div id="app">
<p>{{message}}</p>
</div>
<script type="text/javascript">
var vm = new Vue({
el: '#app',
data: {
{message}
},
methods: {
details: function() {
''
}
}
})
</script>
三：Vue 选项（el data methods）:
1. el
☞ 作用：指定管理的视图区域
☞ 指定方式：通过选择器或者 DOM 对象
☞ 注意：不能指定<body>和<html> 标签作为视图，因为<script>包含在<body>和<html> 标签中
2. data
☞ 作用：指定 vm 中的响应数据
☞ 注意：数据的使用需要提前声明
3. methods
☞ 作用：定义函数，提供给 vm 实例去使用
☞ 注意：fn ( ) { } 是推荐写法，等同于普通函数 function fn ( ) { }
不推荐使用箭头函数，因为箭头函数中没有 this ，可以理解为它的上一级，也就是说 this 的指向取决于定义它的位置
☞ 函数中的 this 就是 vm 实例
四：Vue 相关术语---模板语法：
1. 插值表达式：
2. 属性：
3. 表达式：
4. 指令：
5. 参数：
6. 修饰符
7. 用户输入：
8. 过滤器：
9. 缩写：
Vue 知识整理—02-起步的更多相关文章
- Vue 知识整理—01-基础
一:Vue是什么? Vue是一个JS框架. Vue.js是一套构建用户界面的渐进式框架. 库和框架的区别: ☞库:提供一些 API 工具函数,体现了封装的思想,需要我们主动调用: ☞框架:提供一套完整 ...
- Vue知识整理15：组件注册
采用局部注册组件: 将代码放在vue的一个实例中,而不是单列申明.
- Vue知识整理14：组件基础
组件:可以复用的实例.使用 v-component来实现 2.通过props属性添加相应的属性,并且在模板中渲染 当模板中包含多个组件时,则需要用一个div来包裹起来.如下: 可以将原来的的点击事件, ...
- Vue知识整理10：条件渲染（v-if v-show）
在Vue中使用v-if等条件实现条件的判断来实现对象的显示. 也可以采用 v-show条件来实现对象的显示.
- Vue知识整理7：vue中函数的应用
在vue中使用函数对字符串做相应的处理: split:分割字符,将每个字符分割为一个数组值: reverse:将字符进行逆序排序: join:将字符连接: 最终输出结果.
- Vue知识整理6：JavaScript表达式
可在vue中运用js表达式,完成数据的运算(包括三元运算).比较等操作.
- Vue知识整理2：Vue生命周期方法
在vue执行过程中,可以分为beforeCreate.created.BeforeMount.mounted .BeforeUpdate.updated 等常用的方法,如下图所示. 除此之外,通过查 ...
- Vue知识整理1：$watch方法的使用
如下图所示:vue中,可以使用$watch方法显示变量的前面值和当前值,方便进行判断.使用方法: vm.$watch('a',function(newval,oldval){ ...... })
- Vue知识整理16：单文件组件
过程较为复杂,这里直接写出视频地址,可以直接查看 https://learning.dcloud.io/#/?vid=14
随机推荐
- Oracle 10g 使用REGEXP_SUBSTR 分拆字符串 （转）
SELECT l_count, REGEXP_SUBSTR('add, daddf, dsdf, asdfa, dsfasd, dsfad','[^,]+',1,l_count) AS NAME F ...
- JavaScript之jsx&react
1.Virtual DOM 1.将网页所有内容映射到一颗树形结构的层级对象模型上,浏览器提供对dom的支持,用户可以是用脚本调用dom,api来动态修改dom节点,从而达到修改网页目的,这种修改是浏览 ...
- 孙子兵法的计是最早的SWOT分析，《孙子兵法》首先不是战法，而是不战之法。首先不是战胜之法，而是不败之法
孙子兵法的计是最早的SWOT分析,<孙子兵法>首先不是战法,而是不战之法.首先不是战胜之法,而是不败之法 在打仗之前,你要详细地去算. 计算的目的是什么呢?孙子说,是为了知胜,就是为了知道 ...
- Linux Spi驱动移植小结
2012-01-07 22:21:29 效果图: 理论学习后,主要是linux中spi子系统设备框架的了解后,主控制器与设备分离的思想,那么我要开始动手了. 1, make menuconfig添加 ...
- 《CSS世界》读书笔记（十六）
<!-- <CSS世界>张鑫旭著 --> line-height与“垂直居中” line-height 可以让单行或多行元素近似垂直居中,原因在于 CSS 中“行距的上下等分机 ...
- vmware中centos6.7系统图形化安装Oracle显示乱码问题解决
root下: 修改环境属性 vi /etc/sysconfig/i18n LANG="en_US.UTF-8 1.在每次调用图形界面以前,我们使用export临时设置LANG(ORACLE ...
- 原生js开发，无依赖、轻量级的现代浏览器图片懒加载插件，适合在移动端开发使用
优势 1.原生js开发,不依赖任何框架或库 2.支持将各种宽高不一致的图片,自动剪切成默认图片的宽高 比如说你的默认图片是一张正方形的图片,则各种宽度高度不一样的图片,自动剪切成正方形. 完美解决移动 ...
- Java线程基础（一）
说在前面,经过一段学习过后,自己发觉线程在Java中占有举足轻重的地位,总觉得如此复杂的线程知识点一定要好好理清才好消化,因而有了这篇文章. 但因鄙人资历尚浅,如有遗漏错误之处还请广大网友不吝赐教. ...
- [c/c++] programming之路（30）、位运算（一）
一.取反 ~ #include<stdio.h> #include<stdlib.h> void main(){ unsigned ; //0000 1111 char的单位是 ...
- MemoryStream生成Excel
public static MemoryStream ToExcel<T>(List<T> list, string filePath = null) { var memory ...