element ui form表单遍历map
时间: 2023-08-22 07:08:08 浏览: 168
要在 Element UI 的表单中遍历一个 Map,你可以使用 `v-for` 指令来循环遍历 Map 的键值对。以下是一个示例代码:
```html
<template>
<el-form :model="form">
<el-form-item v-for="(value, key) in formMap" :key="key" :label="key">
<el-input v-model="formMap[key]"></el-input>
</el-form-item>
</el-form>
</template>
<script>
export default {
data() {
return {
form: {},
formMap: new Map([
['name', ''],
['age', ''],
['email', '']
]) // 这里是你的 Map 数据
};
}
};
</script>
```
在上面的代码中,我们使用了 `v-for` 指令来循环遍历 `formMap` 中的键值对。`v-for="(value, key) in formMap"` 表示将 `formMap` 中的每个键值对分别赋值给 `value` 和 `key` 变量。然后,我们在 `el-form-item` 中使用 `key` 作为标签名,并将对应的值绑定到 `el-input` 的 `v-model` 上,实现了表单项与 Map 中的值的双向绑定。
这样,你就可以在 Element UI 的表单中遍历并操作一个 Map 数据了。
阅读全文