vue3 script setup get parent component function and parameter method

<script setup>

It can really be said that it is a very convenient development method
, but there will be some problems when there is no direct setup
to get the parameters and functions of the parent component.
In fact, Vue officially provides me with defineProps and defineEmits. These two methods are officially provided
. Just import it and use it directly

For example, here we pass three parameters to the child component
: imgSrc="user.images"
:name="user.name"
size="42px"

in subcomponents

const props = defineProps({
    
    
    imgSrc: {
    
    
        type: String,
        required: true, // 必须传递
    },
    name: {
    
    
        type: String,
        required: true,
    },
    width: {
    
    
        type: String,
        default: "0px",
    },
});
const imgSrc = ref(props.imgSrc)
const name = ref(props.name)
const width = ref(props.width)

We can get it like this

function words

I defined a function in parent component

const setList = (name)=> {
    
    
  console.log(name);
}

takes a parameter and outputs

Pass him to this subcomponent
and then in the subcomponent we can call it like this

const setList = defineEmits(['setList'])
const setListmint = function() {
    
    
  setList('setList',"你好啊java");
}

First use defineEmits to get the collection of parent component functions

Then pass the parameters of the function to be called after the name of the collection