In Vue 3, I'm unable to obtain the selected value of the `<sp-dropdown>` component through the `@change` event. What could be the possible reasons and how can I fix this issue?

In Vue 3, I’m unable to obtain the selected value of the <sp-dropdown> component through the @change event. What could be the possible reasons and how can I fix this issue?

I have tried using both ref and the @change event, but I still can’t obtain the selected value .

<template>
  <div class="content">
    <sp-dropdown ref="platformDropdown" @change="handleChange" >
        <sp-label slot="label" isrequired="true">demo</sp-label>
        <sp-menu slot="options" >
            <sp-menu-item value="douyin"> douyin </sp-menu-item>
            <sp-menu-item value="kuaishou"> kuaishou </sp-menu-item>
        </sp-menu>
    </sp-dropdown>
  </div>
</template>
<script setup>
import { ref } from "vue";
const platformDropdown= ref(null);

const handleChange = (e) => {
  console.log('value', e.target.value) //undefined

}
</script>