vue3+tsx父组件调用子组件中的ref

最新推荐文章于 2024-05-16 11:55:32 发布

什么都不会的全栈工程师

最新推荐文章于 2024-05-16 11:55:32 发布

阅读量1.8k

点赞数 3

文章标签： vue.js ts

本文链接：https://blog.csdn.net/m0_59394063/article/details/122948854

版权

//父组件
export default defineComponent({
    setup() {
        type stateType = {
            childRef: any
        }

        const state: stateType = reactive({
            childRef: null
        })

        //使用
        function submit() {
            state.childRef.xxx子组件ref中的方法
        }

        return () => (
            <div>
                <Child refCallback={(ref: any) => state.childRef= ref} />
                <button on-click={() => submit()}/>
            </div>
        )
    }
})

//子组件
const Child = defineComponent({
    props: ["refCallback"]
    setup(props) {
        return () => (
            <Form ref={props.refCallback}>
            </Form>
        )
    }
})