1、父組件向子組件傳值
父組件
<fitSteps :stepActive="stepActive">
<div>插槽信息</div>
<van-button type="primary" @click="FatherClick">下一步</van-button>
</fitSteps>
const stepActive = ref(0)
const FatherClick = () => {
stepActive.value += 1
}
子組件
<van-steps :active="stepActive" finish-icon="passed" active-icon="success"> <van-step>測試</van-steps> </van-steps> <slot></slot>
const props = defineProps({ stepActive:{ type:Number,//類型字符串 default:0//如果沒有傳遞msg參數,默認值是這個 } })
2、父組件調用子組件的方法
父組件
<fitSteps ref="ChildsDom"> <div>插槽信息</div> </fitSteps> <van-button type="primary" @click="FatherClick">下一步</van-button>
const ChildsDom = ref(null); const FatherClick = () => { ChildsDom.value.handelClick(); // console.log("ChildsDom.value", ChildsDom.value) }
子組件
const handelClick = () => { console.log('234'); } defineExpose({ handelClick, });
浙公網安備 33010602011771號