(一)

  new一个Vue对象的时候,可以设置它的属性,其中最重要是三个,分别是

  data,,methods,watch.

new Vue({
data:{
a:,
b:[]
},
methods:{
doSomething:function(){
this.a++;
}
},
watch:{
'a':function(val,oldVale){
}
}
})

(二)模板指令

  1、数据渲染 :v-text,v-html, {{}}

2、控制模块隐藏: v-if,v-show

  3、渲染循环列表: v-for

data:{

    items:[
      { lable:'apple' }
    ]
  }   <ul>
    <li v-for='item in items'>
      <p v-text='item.label'></p>
    </li>
  </ul>

  4、事件绑定

    v-on

<button v-on:click="doThis"></button>
<button @clcik="doThis"></button>

  5、属性绑定

    v-bind

<img v-bind:src="data:imageSrc">
<div :class="{ red:isRed } "></div>
<div :class="[classA,classB]"></div>

Vue.js 组件重要选项的更多相关文章

  1. Vue.js组件的重要选项

    Vue.js组件的重要选项 实例化Vue对象一些很重要的选项,Vue的所有数据都是放在data里面的,Vue的参数是个对象,对象里面的字段叫做data,data里面也是对象,data也可以写作是thi ...

  2. vue.js组件化开发实践

    前言 公司目前制作一个H5活动,特别是有一定统一结构的活动,都要码一个重复的轮子.后来接到一个基于模板的活动设计系统的需求,便有了下面的内容.借油开车. 组件化 需求一到,接就是怎么实现,技术选型自然 ...

  3. VUE.JS组件化

    VUE.JS组件化 前言 公司目前制作一个H5活动,特别是有一定统一结构的活动,都要码一个重复的轮子.后来接到一个基于模板的活动设计系统的需求,便有了下面的内容.借油开车. 组件化 需求一到,接就是怎 ...

  4. 浅尝Vue.js组件(一)

    本篇目录: 组件名 组件注册 全局注册 基础组件的自动化全局注册 局部注册 在模块系统中局部注册 Prop 单向数据流 Prop验证 类型检查 非Prop特性 替换/合并已有的特性 禁用特性继承 自定 ...

  5. Vue.js 组件的三个 API:prop、event、slot

    组件的构成 一个再复杂的组件,都是由三部分组成的:prop.event.slot,它们构成了 Vue.js 组件的 API.如果你开发的是一个通用组件,那一定要事先设计好这三部分,因为组件一旦发布,后 ...

  6. 如何理解vue.js组件的作用域是独立的

    vue.js组件的作用域是独立,可以从以下三个方面理解: 1.父组件模板在父组件作用域内编译,父组件模板的数据用父组件内data数据:2.子组件模板在子组件作用域内编译,子组件模板的数据用子组件内da ...

  7. Vue.js 组件编码规范

    本规范提供了一种统一的编码规范来编写 Vue.js 代码.这使得代码具有如下的特性: 其它开发者或是团队成员更容易阅读和理解. IDEs 更容易理解代码,从而提供高亮.格式化等辅助功能 更容易使用现有 ...

  8. Vue.js组件学习

    组件可以扩展HTML元素,封装可重用的HTML代码,我们可以将组件看作自定义的HTML元素.组件系统提供了一种抽象,让我们可以使用独立可复用的小组件来构建大型应用. 一个简单组件例子(全局注册) &l ...

  9. vue.js 组件之间传递数据

    前言 组件是 vue.js 最强大的功能之一,而组件实例的作用域是相互独立的,这就意味着不同组件之间的数据无法相互引用.如何传递数据也成了组件的重要知识点之一. 组件 组件与组件之间,还存在着不同的关 ...

随机推荐

  1. reverse iterator

    Problem 1: vector<int> coll = { 1, 2, 3, 4, 5, 6, 7, 8, 9 }; vector<int>::const_iterator ...

  2. ios 设置声音和震动,单独控制

    一.今天项目中涉及了设置这快的声音震动和响铃,搞的头大,以前搞过,只是简单的调用系统的方法就可以实现,但是现在的公司要求,震动是震动,响铃是响铃,我看了微信,微信也是的分开的,做的很好,但是我就纳闷了 ...

  3. ios中,在SearchBar里面搜索内容,可根据内容来查找所需的信息资源,可获得SearchBar中的内容

    贴一段我很久以前写的小demo,你们就明白了,是把textField套在alertView里的@interface ViewController : UIViewController <UIAl ...

  4. AX7: HOW TO USE TABLE METHOD EXTENSION CLASS

    To create new methods on a table without customize you should use the Table method extension class. ...

  5. ACM知识点

    基础算法 高精 模拟 分治 贪心 排序 DFS 迭代加深搜索 BFS 双向BFS 动态规划 DAG上DP 树上DP 线性DP 图算法 最短路 FLYD DJATL BF 最大流 Dinic ISAP ...

  6. jquery append 方法应用

    <!DOCTYPE html><html><head><meta charset="utf-8"><title>< ...

  7. 1、基于MFC的OpenGL程序

    首先,使用的库是GLUT以及GLAUX,先下载两者,添加查找路径以及链接   一.单文本文件   工程openGLMFC 1.创建单文本文件   2.添加路径.链接 方法如之前篇章所示, 链接库为op ...

  8. JS判断input按了回车键

    参考代码如下: <input type="textbox" id="textbox1" onkeypress="CheckInfo" ...

  9. cs11_c++_lab4b

    SparseVector.hh class SparseVector { private: //结构体不一定会用到,不用初始化 struct node { int index; int value; ...

  10. js实现继承的两种方式

    这是面试时面试官会经常问到问题: js的继承方式大致可分为两种:对象冒充和原型方式: 一.先说对象冒充,又可分为3种:临时属性方式.call().apply(): 1.临时属性方式: 当构造对象son ...