diffractive-cookbook/components/CookbookForm.js

export default {
  name : "CookbookForm",
  setup(){
    const {ref}=Vue 

    const title = ref('')
    const description = ref('')
    const nature = ref('')
    const log = ref('')
    const who = ref('')

    return{title,description,nature,log,who}
  },
    template: `
    <form action="">
    <label for="title">Title</label>
    <input type="text" v-model='title'/>

    <label for="description">Description</label>
    <textarea v-model="description"></textarea>

    <label for="nature">Nature of the input</label>
    <input type="text" v-model="nature" />

    <label for="log">Process Log</label>
    <textarea v-model="log"></textarea>

    <label for="who">Who</label>
    <input type="text" v-model="who" />
  </form>
  

  <pre>
  title:{{title}}
  description:{{description}}
  nature:{{nature}}
  log:{{log}}
  who:{{who}}
  </pre>


  `
}