Skip to content

Instantly share code, notes, and snippets.

@cristijora
Last active July 11, 2019 18:57
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save cristijora/bff0c6c4cf5e996591520ff4f2a7f579 to your computer and use it in GitHub Desktop.
Save cristijora/bff0c6c4cf5e996591520ff4f2a7f579 to your computer and use it in GitHub Desktop.
// Parent
<template>
<div>
<span> Email {{user.email}}</span>
<span> Name {{user.name}}</span>
<user-form :user="user" @submit="updateUser"/>
</div>
</template>
<script>
import UserForm from "./UserForm"
export default {
components: {UserForm},
data() {
return {
user: {
email: 'loreipsum@email.com',
name: 'Lorem Ipsum'
}
}
},
methods: {
updateUser() {
// Send a request to the server and save the user
}
}
}
</script>
// UserForm.vue Child
<template>
<div>
<input placeholder="Email" type="email" v-model="user.email"/>
<input placeholder="Name" v-model="user.name"/>
<button @click="$emit('submit')">Save</button>
</div>
</template>
<script>
export default {
props: {
user: {
type: Object,
default: () => ({})
}
}
}
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment