[Vuejs]-Laravel and Vue templating error

by

0👍

✅

I think this is happening because you have put v-for in template itself, you have to put in inside template, in another div or some other element, like following:

<template id="messages-template">
  <div>
    <div v-for="messages in list">
      <p> @{{ messages && messages.name }}</p>
    </div>
  </div>
</template>

Reason of the error:

vue.js:513 [Vue warn]: Multiple root nodes returned from render function. Render function should return a single root node.
(found in component )

You were getting this error because in your component template you can not use v-for directive on a root element. For example following is not allowed because your component can have multiple root elements:

<template id="messages-template">
    <div v-for="messages in list">
      <p> @{{ messages && messages.name }}</p>
    </div>
</template>

Leave a comment