Vue将List中对象的元素赋值到table对应位置中
Posted 保护眼睛
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了Vue将List中对象的元素赋值到table对应位置中相关的知识，希望对你有一定的参考价值。
Vue学习笔记
代码
<body>
<div id="app" style="text-align: center;background-color: yellow;text-indent: 20px">
<v-simple-table v-show="true">
<template v-slot:default >
<thead>
<tr style="background-color: dodgerblue;text-align: center">
<th class="text-left">序号</th>
<th class="text-left">用户</th>
<th class="text-left">状态</th>
</tr>
</thead>
<tbody>
<tr v-for="user in userlist" style="background-color: dodgerblue;text-align: center">
<td>user.id</td>
<td>user.username</td>
<td>user.isadmin</td>
</tr>
</tbody>
</template>
</v-simple-table>
<v-btn v-on:click="updata">点击改变</v-btn>
</div>
</body>
<script>
let app = new Vue(
el:"#app",
data:
userlist:[
"id":1,"username":"hello","isadmin":1,
"id":2,"username":"ypc","isadmin":1,
"id":3,"username":"test","isadmin":0,
]
,
methods:
updata()
app.userlist[0].username = "changetest";
);
</script>
结果
以上是关于Vue将List中对象的元素赋值到table对应位置中的主要内容，如果未能解决你的问题，请参考以下文章