Как использовать переменные prop внутри vue формулируют?

Question

Я пытался передать данные дочернему компоненту, используя v-bind для моего vue ввода формы формулировки. Я передал такие данные в родительский.

<ChildForm v-bind:formData="formData" ></ChildForm>

    export default {
      name: "Parent",
      data() {
        return {

    formData: {
          Full_Name: "",
          Notes: "",
          Address: "",
          Phone: "",
          City: "",
          State: "",
          Zip: "",
    },
    }}}

А в Child я делаю это

    <FormulateForm v-model="formData">
      <FormulateInput
                type="textarea"
                name="Notes"
                label="NOTES"
                validation="required|max:200,length"
                validation-name="Notes"
                :help="`Keep it under 200 characters. ${200 - this.formData.Notes.length} left.`"
              />

      <FormulateInput
               type="submit"
               label="Submit Details"
               />
    </FormulateForm>

export default {
  name: "ChildForm",
  props: {
    formData: Object,
  },
}

Но я получаю следующую ошибку:

Error in render: "TypeError: Cannot read property 'length' of undefined"

Есть идеи, в чем может быть проблема?

Answer 1

Вы должны использовать

formData.Notes.length

вместо

this.formData.Notes.length