听写_11.6

1. 手写一个vue页面，将data中的msg显示在页面中，用插值表达式和v-text和v-html三种方式。

<div id=app>
<p>111{{msg}}</p>
<p v-text="msg"></p>
<p v-html="msg2"></p>
</div>
<script>
var vm=new Vue({
el:"#app",
data:{
msg="222",
msg2="<h6>222</h6>"
}
});
</script>

3. v-for可以遍历那些值？遍历它们的语法分别是什么？

数字，数组，对象
<p v-for="value in a">
<span>{{valua}}</span>
</p>

<p v-for="(value,key) in a">
<span>{{key}}</span>
<span>{{value}}</span>
</p>

<p v-for="(value,key,i) in a">
<span>{{i}}</span>
<span>{{key}}</span>
<span>{{value}}</span>
</p>

4. 强变量类型和若变量类型语言的差异性是什么？

强变量不经强制转化无法改变类型，弱变量则相反

5. 将M中数据设置给标签的class属性的方式有几种？请分别写出一个案例。

单个值设置给标签:
<div id="app">
			<div :class="c1">c1</div>
</div>
<script type="text/javascript"></script>
			<script>
				var vm = new Vue({
					el: '#app',
					data: {
						c1: 'cred',	
						}
			</script>

对象式设置:
			cobj: {
			cred: true,
			w100: true,
			byellow: true
			}

简单数组设置:
		     cSimplearray: ['cted', 'w100', 'byellow']

对象数组设置:
			cobjarray: [{
				cred: true
			}, {
				byellow: false
			}, 'w100']

6. 将M中数据设置给标签的style属性的方式有几种？请分别写出一个案例。

 将对象属性对应的样式值设置给标签:
<div id="app">
   <p :style="styleObjArray">1111</p>
</div>
   	<script src="js/vue.js"></script>
   <script type="text/javascript">
   	var vm = new Vue({
   		el: '#app',
   		styleObj: {
   			'color': 'red',
   			'font-size': '40px',
   		},
   	});
   </script>				

将数组中对象中css样式设置给标签:
   			styleObjArray: [
   				{'color': 'red'},
   				{'font-size': '50px'}
   			]