Vue的数据传递 看完就掌握 不懂你砍我

今天在学习vue购物车案例的时候 发现功能的实现都和数据传递有关 自己在数据传递这块掌握不是很牢固 所以整了下面的数据传递

---

vue的数据传递大概可以分为三种

父 -> 子

子 -> 父

子1 -> 子2

---

父 -> 子

第一种也是最简单的一种

用到了自定义属性 props

1.首先要在接受数据的一方    父    定义 props

<script>
	export default{
		props:['msg']
	}
</script>

2.在发送数据一方     子

<template>
  <div id="app">
	<h1>我是父亲</h1>
	<p>我要向son1传递的数据是: {
  { str }}</p>
	<!-- 使用子组件son1 -->
	<!-- 把数据传递给自定义属性 msg -->
	<son1 :msg='str'></son1>
  </div>
</template>

<script>
//导入 子组件 son1
import son1 from '@/components/son1.vue'

export default {
	data(){
		return{
			str:'hello vue'  //要发送的数据
		}
	},
	//注册子组件 son1
	compon