作者:黑暗中的数字 | 来源:互联网 | 2023-09-09 11:42
DOCTYPE html> {{item}} {{item.ename}}=={{index
DOCTYPE html>
<html>
<head>
<title>
title>
head>
<body>
<div id="app">
<ol>
<li v-for="item in fruit">{{item}}li>
<li v-for="(item,index) in myClass">{{item.ename}}=={{index}}=={{item.cname}}li>
ol>
div>
<script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js">script>
<script type="text/Javascript">script>
<script type="text/Javascript">
new Vue({
el: ‘#app‘,
data: {
fruit:[‘apple‘,‘banana‘,‘orange‘],
myClass:[{ename:‘apple‘,cname:‘苹果‘},{ename:‘banana‘,cname:‘香蕉‘},{ename:‘orange‘,cname:‘橘子‘},]
}
})
script>
body>
html>
Vue的for 加上v-bind:key="index(或者id)"可以调高vue的性能
DOCTYPE html>
<html>
<head>
<title>
title>
head>
<body>
<div id="app">
<ol>
<li v-for="(item,key,index) in obj">{{key}}=={{index}}=={{item}}li>
ol>
div>
<script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js">script>
<script type="text/Javascript">script>
<script type="text/Javascript">
//在原生js中使用
var obj={
name:‘张三‘,
age:18,
gender:‘male‘
}
for (var key in obj) {
console.log(key,obj[key]);
}
new Vue({
el: ‘#app‘,
data: {
obj
}
})
script>
body>
html>
Vue的key使用实例