vue中v-for的使用

渲染数组

<p v-for="(item,index) in list" :key="index">{{item.name}}</p>

data(){
	return {
		list:[
		{name:"people1"},
		{name:"people2"},
		{name:"people3"}
		]
	}
}

//结果
people1
people2
people3

渲染对象

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

data(){
	return{
		obj:{
			name:"哈哈哈",
			sex:"男",
			age:21
		}
	}
}

//结果
0---name---哈哈哈
1---sex---男
2---age---21

v-if不推荐与v-for一起使用

当他们处于同一节点，v-for的优先级高于v-if，这意味着 v-if 将分别重复运行于每个 v-for 循环中。
可将v-if置于外层元素上。

如何插入一段漂亮的代码片

去博客设置页面，选择一款你喜欢的代码片高亮样式，下面展示同样高亮的 代码片.

// An highlighted block
var foo = 'bar';