Vue - custom component

From AWVVO
Jump to navigationJump to search

Vue custom component template

<template>
  <div>
    <h2>{{ title }}</h2>
    <form @submit.prevent="handleSubmit">
      <slot></slot>
      <button type="submit">Submit</button>
    </form>
  </div>
</template>

<script setup>
const props = defineProps({
  title: {
    type: String,
    default: 'Form'
  }
})

const emit = defineEmits(['submit'])

const handleSubmit = (event) => {
  emit('submit', event)
}
</script>