[Vue warn]: Failed to generate render function:

The error was in fact as you pointed in there

attrs: {
    "type": "text",
    "name": "phone",
    "value": "",
    "id": "phone",
    "phone_number":
}

"phone_number": here isn't set to anything, that's why Vue squacked and threw an error saying that the } was unexpected.


If you are using Laravel and you are passing data in a Blade template like this:

<your-component :value="{{ $myValue }}"></your-component>

It may be that $myValue is null and therefore the error occurs.

A simple way to fix this is to use json_encode before passing values as an attribute to the component:

<your-component :value="{{ json_encode($myValue) }}"></your-component>

Tags:

Vue.Js