[英]Error: vue.js:634 [Vue warn]: Property or method "item" is not defined on the instance but referenced during render
Sorry.对不起。 I don't understand, why Vue executes code v-for and broken with another
我不明白,为什么 Vue 执行代码 v-for 并与另一个中断
<div v_model="main">
<tr v-for="item in main" >
<th scope="row">[[ item.name ]]</th>
</tr>
</div>
dosn't wort没用的
<div v_model="main">
<tr v-for="item in main" >
<th scope="row">[[ item.name ]]</th>
</tr>
</div>
working code:工作代码:
<li class="form-control input-xs" v-for="item in main">
<label> [[ item.name ]] </label>
</li>
I used Django, because option: delimiters: ['[[', ']]']我使用了 Django,因为选项:分隔符:['[[', ']]']
Help me, please understand this error.帮帮我,请理解这个错误。
The issue is due to your invalid HTML.该问题是由于您的 HTML 无效造成的。
Vue is validating your document structure and since <tr>
should only ever be a child of <table>
, <thead>
, <tbody>
or <tfoot>
(see <tr>
: The Table Row element - Technical summary - Permitted parents ), your v-for
expression is not evaluated. Vue 正在验证您的文档结构,因为
<tr>
应该只是<table>
、 <thead>
、 <tbody>
或<tfoot>
元素(请参阅<tr>
:表格行元素 - 技术摘要 - 允许的父母) ,您的v-for
表达式不会被评估。
Here's a working example...这是一个工作示例...
new Vue({ delimiters: ['[[', ']]'], el: "#app", data: { main: [ { name: "Learn JavaScript", done: false }, { name: "Learn Vue", done: false }, { name: "Play around in JSFiddle", done: true }, { name: "Build something awesome", done: true } ] } })
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.min.js"></script> <div id="app"> <table border="1"> <tr v-for="item in main" > <th scope="row">[[ item.name ]]</th> <td>[[ item.done ? '✔️' : '❌' ]]</td> </tr> </table> </div>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.