Vue常用指令及父子传值

v-model 双向绑定 主要用于表单元素
 v-for 循环

例

		<div class="app">
		    <ul>
				<li v-for="value in arr">{{value}}</li>   
			</ul>
		</div>
		<script>
			var vm = new Vue({
				el: '.app',
				data(){
					 return{
						 arr:[1,2,3]
					 }
				}
			})		
		</script>

父子组件传递数据

父传子

 <stepItem :message='msg'></stepItem>            
 <!-- 父组件中 设置引用的组件传递一个message message为我设的别名 msg为实例中的数据 -->

props:['message']    子组件实例中定义props接受

子传父

子组件中

send(){
		this.$emit('event-name',this.age,this.height);    
		子组件中定义一个发送方法 使用$emit发送函数 第一个参数为我设的接受别名 后面的参数为我需要传递的值
	   }

父组件中

  <stepItem :message='msg[0]' @event-name="getdata"></stepItem>   
  父组件中在引用子组件的地方用@+别名 设置接受方法后跟函数
   注意@跟的是别名与子组件emit第一个参数必须相同
  
  		getdata(age,height){
			this.age=age;
			this.height=height;
		},
		接受方法需要设置接受参数 且需要在父组件数据中初始化 赋值为空