1、 Error description

2、 The reason for the error

<template>
<blog-info v-for="info in infos"
v-bind:key="info.id"
v:bind:title="info.title"></blog-info>
</template>
<script>
export default {
name: "Blog",
data() {
return {
infos: [
{id:1,title:" Zhang "},
{id:2,title:" money "},
{id:3,title:" Grandchildren "},
{id:4,title:" Li "},
{id:5,title:" Zhao "},
{id:6,title:" hu "}
]
}
},
}
</script>
<style>
</style>

    v-for Instructions cannot be written on the root element node , Because multiple elements will be rendered

3、 terms of settlement

      Nest an element outside the component

<template>
<div id="blogInfo">
<blog-info v-for="info in infos"
v-bind:key="info.id"
v:bind:title="info.title"></blog-info>
</div>
</template>
<script>
export default {
name: "Blog",
data() {
return {
infos: [
{id:1,title:" Zhang "},
{id:2,title:" money "},
{id:3,title:" Grandchildren "},
{id:4,title:" Li "},
{id:5,title:" Zhao "},
{id:6,title:" hu "}
]
}
},
}
</script>
<style>
</style>