Vue 2.0 初探(二)

/ 0评 / 0

先看一下 computed,这个东西与methods这些事同级的,主要是为了处理一些页面上需要展示的数据,这样写看起来更直观,比直接 {{ todos.length }} 这样去写看起来好辨认多了

computed: {  //处理页面中展示的一些数据 
			todoCount(){
				return this.todos.length;
			}
		},

再看一下 v-bind:class,有两种写法

v-bind:class="{ 'completed' : todo.completed }"    //这个前面是calss名,后面是判断条件
v-bind:class="[todo.completed ? 'btn-danger' : 'btn-success']"   //这个就是个三目运算符

来看一下例子,还是在之前的基础上写的


欢迎啊!

MY todos {{ todos.length }} {{ todoCount }}

  • {{ todo.title }}

总的来说 v-bind:class 用的还是挺多的,可以去官网看看文档

评论已关闭。