时间戳

首页 > 解决方案 > 如何将 Vue 关联数组转录为 HTML 表单输入值

html - 如何将 Vue 关联数组转录为 HTML 表单输入值

问题描述

我有一个 HTML 表单，它曾经有基于 Vue 数组的输入值，如下所示：

// Vue Var
var postIDarr = [postID, postID, etc., etc.];
// HTML
<input v-for="(id, index) in postIDarr" type="hidden" name="postIDArr[]" :key="index" :value="id">

这在一段时间内工作得很好，但现在我想让数组成为一个关联数组，同时编码 postID 和 userID 以便在后端进行处理。Vue中的数组结构如下；

var postIDarr = {
    userID: postID,
};
// These are placeholders obviously

我如何能够将这两个值都编码到 HTML 表单中？

不完全确定如何在不重复的情况下编写此问题，如果您需要更多信息，请告诉我。

标签： htmljsonvue.js

解决方案

如果你有一个像这样的对象：

var postIDarr = {
    userID: postID,
}

并且您想通过显示键和值来使用 v-for 渲染它，因此您可以这样做：

 v-for="(id,key, index) in postIDarr"

id指postID

key指userID

推荐阅读