“Vue v-for 指令”的版本间的差异
跳到导航
跳到搜索
Jihongchang(讨论 | 贡献) (建立内容为“https://www.bilibili.com/video/BV12J411m7MG/?p=15”的新页面) |
Jihongchang(讨论 | 贡献) |
||
第1行: | 第1行: | ||
https://www.bilibili.com/video/BV12J411m7MG/?p=15 | https://www.bilibili.com/video/BV12J411m7MG/?p=15 | ||
+ | |||
+ | 根据数据生成列表结构 | ||
+ | |||
+ | 形式1:<syntaxhighlight lang="html"> | ||
+ | <div id="app"> | ||
+ | <ul> | ||
+ | <li v-for="item in arr"> | ||
+ | 你好 | ||
+ | </li> | ||
+ | </ul> | ||
+ | </div> | ||
+ | </syntaxhighlight><syntaxhighlight lang="html"> | ||
+ | <div id="app"> | ||
+ | <ul> | ||
+ | <li v-for="item in arr" :title="title"> | ||
+ | {{ item }} | ||
+ | </li> | ||
+ | </ul> | ||
+ | </div> | ||
+ | </syntaxhighlight><syntaxhighlight lang="javascript"> | ||
+ | var app = new Vue({ | ||
+ | el:"#app", | ||
+ | data:{ | ||
+ | arr:[1,2,3,4,5] | ||
+ | } | ||
+ | }) | ||
+ | </syntaxhighlight> |
2023年8月8日 (二) 05:49的版本
https://www.bilibili.com/video/BV12J411m7MG/?p=15
根据数据生成列表结构
形式1:
<div id="app">
<ul>
<li v-for="item in arr">
你好
</li>
</ul>
</div>
<div id="app">
<ul>
<li v-for="item in arr" :title="title">
{{ item }}
</li>
</ul>
</div>
var app = new Vue({
el:"#app",
data:{
arr:[1,2,3,4,5]
}
})