Vue why props is undefined on component

I try to transfer data to my component using props If I type the name in the parent, I see that the button is working properly, ie the problem is with the component. Where am I wrong?

Thanks in advance

Parent:

HTML

<div><button @click="changeName" :name="name">Change my name</button></div>

Script:

import UserDetail from "./UserDetail.vue";
export default {
  components: {
    UserDetail,
    UserEdit,
  },
  data() {
    return {
      name: "Eden",
    };
  },
  methods: {
    changeName() {
      this.name = "EdenM";
    },
  },
};

Component

<template>
  <div>
    <p>{{ name }}</p>
  </div>
</template>

<script>
export default {
  props: ["name"],
};
</script>