Importieren Sie eine Komponente und ihre Eigenschaften/Methoden in eine andere Komponente

Question

Wenn ich die Komponente LogoutButton.vue habe

export default {
  data() 
  {
      return {

      }
      
  },
  methods: 
  { 
    Logout()
    {
        console.log("something")
    }
  }
}
</script>
<template>
    <button @click="Logout">Logout</button>
</template>

Wie verwende ich die LogoutButton-Komponente in anderen Komponenten? Ich meine, wie importiert man diese Komponente und ihre Klickmethode in eine andere Komponente?

Answer 1

<script>
import LogoutButton from './LogoutButton.vue'

export default {
  components: {
    LogoutButton
  },
  data() 
  {
      return {

      }
      
  },
  methods: 
  { 
    // Your different methods
  }
}
</script>

<template>
  <div>
    <!-- The template from LogoutButton component will display here -->
    <LogoutButton />
  </div>
</template>