2023/08/3uniapp

props

父传子 在子组件里面没有办法修改传过来的属性因为是单项数据流  如果要修改的话就在父组件里面绑定.sync 然后子组件通过this.$emit('update:传过来的属性’，要改变的东西)

 上面是父 底下是子

<template>
	<view>
		
		<!-- <mytanchukuang :state="mystate" @stateenv="on"></mytanchukuang> -->
		<mytanchukuang :state.sync="mystate" ></mytanchukuang>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				mystate:false
			};
		},
		methods:{
			onmyenv(e){
				console.log(e);
			},
			clickBtn(){
				this.mystate=true
			},
			// on(e){
			// 	console.log(e);
			// 	this.mystate=false
			// }
		}
	}
</script>

<style lang="scss">

</style>

<template>
	<view>
		
		<view>	弹出框</view>
		<view class="box" :style="{height:state ? '300rpx':'0'}">
		</view>
		<button size="mini" @click="clickguanbi()">关闭</button>
		
	</view>
</template>

<script>
	export default {
		name:"mytanchukuang",
		props:{
			state:{
				type:Boolean,
				default:false
				
			}
		},
		data() {
			return {
				
			};
		
		},
		methods:{
			clickguanbi(){
				this.$emit("update:state",false)
			}
			
		}
		
	}
</script>

<style lang="scss">
		
	.box{
		width: 300rpx;
		height: 300rpx;
		background: pink;
	}
	

</style>