作业_11.5

最新推荐文章于 2023-11-05 00:36:55 发布

原创最新推荐文章于 2023-11-05 00:36:55 发布 · 157 阅读

0 ·

CC 4.0 BY-SA版权

本文深入探讨了Vue.js中的关键指令，包括v-for的遍历应用、v-model与v-bind的区别、v-show与v-if的工作原理，以及如何使用v-bind进行类绑定。通过实例代码，读者可以更好地理解这些指令的实际操作。

vue的v-for语法可以遍历那些值，分别写出遍历不同值的代码。

   	数字:
   	<p v-for="value in hero">
   		<span>{{value}}</span>
   	</p>
   	数组:
   	<p v-for="(value,key) in hero">
   		<span>{{key}}</span>
   		<span>{{value}}</span>
   	</p>
   	对象:
   	<p v-for="(value,key,i) in hero">
   		<span>{{i}}</span>
   		<span>{{key}}</span>
   		<span>{{value}}</span>
   	</p>

文字叙述v-model和v-bind的差别。

   v-bind的绑定是单向的，data中的某数据可以写入某元素的某个属性，而某元素的某个属性不能写入data中的某数据
   v-model的绑定是双向的，某元素的某个属性和data中的某数据互相写入

文字描述一下v-show和v-if的差别。

    v-if:从源代码中移除从而使标签消失
	v-show:通过display:none的方式标签隐藏

将M中数据设置为标签的类有几种方式？就每种方式写出样例代码。

	单个值设置给标签：c1:'cred'
    对象式设置：cobj:{cred: true,w100: true,byellow: true}
    简单数组设置：cSimplearray: ['cted', 'w100', 'byellow'],
    对象数组设置：cobjarray:[{cred: true},{byellow: false},'w100']