<template>
  <form @submit.prevent="submit" class="article-form-wrapper">
    <my-article-title :update-title-prop="article.title" :title-prop.sync="article.title"></my-article-title>
  </form>
</template>

<script>
import MyArticleTitle from '@/components/Article/ArticleTitle'

export default {
  props: ['articleProp'],
  components: {
    MyArticleTitle
  },
  data () {
    return {
      article: {
        title: ''
      }
    }
  },
  watch: {
    articleProp: {
      deep: true,
      handler () {
        this.article.title = this.articleProp.title
      }
    }
  },
  mounted () {
    if (this.articleProp) {
      console.log('looks like props?')
    } if (!this.articleProp) {
      console.log('no props')
    }
  }
}
</script>