<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>两个数组一个为对象的 key 一个为对象的 value</title>
</head>
<body>
<div id="app">
</div>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>
var vm = new Vue({
el:'#app',
data:{
arr:[
'one',
'two',
'three',
'four'
],
arrs:[
'一秀',
'二举',
'三红',
'四进',
// '四进' //两个需要循环的值需要相同 否则为 null或者不显示
],
obj:{}
},
created(){
for(var i=0;i<this.arr.length;i++){
var keys = this.arr[i]
var val = this.arrs[i]
this.obj[keys] = val
}
console.log(this.obj) //{one: "一秀", two: "二举", three: "三红", four: "四进"}
}
})
</script>
</body>
</html>