码迷,mamicode.com
首页 > Web开发 > 详细

学习vue.js的自我梳理笔记

时间:2018-03-07 21:54:48      阅读:241      评论:0      收藏:0      [点我收藏+]

标签:缓存   color   -o   mat   one   双向数据绑定   dom   dos   调用   

基本语法格式:

<script>

new Vue({

  el: ‘#app‘,

  data: {

    url: ‘http://www.runoob.com‘

  }

})

</script>

 

指令 【指令是带有 v- 前缀的特殊属性。】

       判断  <p v-if="seen">现在你看到我了</p>

       参数  <a v-bind:href="url">菜鸟教程</a>

       监听  v-on 指令,它用于监听 DOM 事件: <a v-on:click="doSomething">

  过滤器:{{ message | capitalize }}   或   <div v-bind:id="rawId | formatId"></div>

    例:

    技术分享图片

 

       双向数据绑定  v-model用在表单控件上的,用于实现双向数据绑定,所以如果你用在除了表单控件以外的标签是没有任何效果的。

 

===========================

计算属性:computed

computed vs methods

我们可以使用 methods 来替代 computed,效果上两个都是一样的,但是 computed 是基于它的依赖缓存,只有相关依赖发生改变时才会重新取值。而使用 methods ,在重新渲染的时候,函数总会重新调用执行。

 

=====================

Vue.js 样式绑定

v-bind:class  设置一个对象

 

===========================

Vue.js 事件处理器

事件监听可以使用 v-on 指令:

 

====================

Vue.js 组件

prop 是单向绑定的:当父组件的属性变化时,将传导给子组件,但是不会反过来。

 

//js

Vue.component(‘todo-item‘, {

  props: [‘todo‘],

  template: ‘<li>{{ todo }}</li>‘

})

 

new Vue({

  el: ‘#app‘,

  data: {

    todo :""

  }

})

 

 

 

不理解的问题:

技术分享图片

 

学习vue.js的自我梳理笔记

标签:缓存   color   -o   mat   one   双向数据绑定   dom   dos   调用   

原文地址:https://www.cnblogs.com/liuyuweb/p/8525016.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!