在另一個元件中匯入元件及其屬性/方法

Question

如果我有元件LogoutButton.vue

#

export default {
  data() 
  {
      return {

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

如何在其他元件中使用 LogoutButton 元件？ 我的意思是如何在其他元件中導入該元件及其單擊方法？

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>