子传父vue/react
vue子传父:很多都是结合defineEmit来实现的,这里通过给子组件传递函数,子组件调用传递下来的函数实现传值。
(图片来源网络,侵删)
父亲:
father Welcome to Your Vue.js App import Demo from './Demo.vue' const clickFather = (e) => { console.log(e) }
儿子:
childStart {{ msg }} childEnd import { ref, defineProps } from "vue"; const count = ref(0); const props = defineProps({ msg: String, clickChild: Function, }); const clickToFather = () => { console.log("props", props); console.log("clickToFather", props.msg); props.clickChild && props.clickChild("22222"); };
react;同样的react也可以通过调用传递下来的函数的方式实现子传父
父:
import React, { useState } from 'react'; import ChildComponent from './Bpp'; const ParentComponent = () => { const handleDataFromChild = (data) => { console.log(data); } return ( 66666666 ); } export default ParentComponent;
子:
import React from "react"; const ChildComponent = (props) => { console.log(props); const sendDataToParent = () => { props.onDataFromChild('000'); }; return ( Send Data to Parent ); }; export default ChildComponent;
文章版权声明:除非注明,否则均为主机测评原创文章,转载或复制请以超链接形式并注明出处。