使用组件我们都会，但是想给子组件传一些父组件的值时就需要用到父传子这个概念啦

一、父传子

父组件传值：

<子组件 :属性名="属性值">
<Son :sonUserInfo="sonUserInfo"></Son>

// data
sonUserInfo:{
					name:'狗子',
					age:500,
					hobby:'追狗盘'
}

属性名：我们要给子组件传过去的变量名 

值：我们要给子组件传过去的值  并且是在父组件中定义过的

子组件接收

第一种接收形式 数组 如果有多个传参 可以，分割开

props : ['sonUserInfo']

第二种接受形式 对象 在传过来的基础上加一些校验的条件

props: {
			sonUserInfo :{
				type:Object,
				default:{},
                required:true //必填项
			}
		},

更多资料可看 官网

二、子传父

1. 子组件使用 $emit 方法进行传递

2. 父组件通过 事件名 进行接受

子组件传值

格式：this.$emit('事件名',参数)

this.$emit('getManyPrice',200)

父组件接受

格式：<子组件 @子组件抛过来的事件名="事件"  />

<Son @getManyPrice="getManyPrice"></Son>

 在事件里面的第一个参数 就可以拿到 子组件传过来的值啦

	methods: {
			getManyPrice(price){
				this.price = price
			}
}

补充：在我们子组件中是不建议直接修改props传过来的值，如果你执意要修改会在控制台发出一个警告错误，如果是复杂数据类型不会遇到 原因是指向了同一个地址，如果想要修改可以通过子组件传递一个事件给父组件进行修改

三、路径传参

 正常跳转

uni.navigateTo({
					url:'/pages/index/uncle'
				})

带参跳转

格式： url:'路径?变量名=值'

uni.navigateTo({
					 url:'/pages/index/uncle?price=' + this.price
				})

带多个参数

格式：url:'路径?变量名=值&变量名=值'

uni.navigateTo({
                    //如果传多个参数 用 &符 隔开
					 url:'/pages/index/uncle?price=' + this.price +'&name=' + this.sonName
				})

模板字符串写法：

格式：url:`路径?变量名=${值}&变量名=${值}`

uni.navigateTo({
					 url:`/pages/index/uncle?price=${this.price}&name=${this.sonName}`
				})

四、本地存储

如果说这个值很多地方都使用到了 我们就可以理由本地存储这个东西

存储：

格式：        uni.setStorageSync('键',值)

		uni.setStorageSync('name',this.sonName)

取：
格式：       uni.getStorageSync('键')

         uni.getStorageSync('name')

注意：如果存储的变量key 之前存在 那么再次存储会直接替换上次的存储 

扩展：浏览器存储的区别