Question

我使用vue.js代替Asp.Net MVC模板和下面是代码。

@model Manage.Models.Commands.Category.UpdateCategoryViewModel

`@using (Html.BeginForm("Update", "Category", FormMethod.Post, new { Category` = Model, @class = "edit" }))
{
<div id="categoriesUpdate">
<div class="modal-content"> 
<div class="modal-header">
<h2>Edit Category</h2>
<button type="button" data-dismiss="modal"><i class="material-icons" aria-hidden="true">&#xE5C9;</i></button>
</div>

<div class="modal-body table-responsive" id="modal-query">
@if (ViewData.ModelState.Values.Any(x => x.Errors.Count >= 1))
{
@Html.ValidationSummary()
} 

<table class="table">
<colgroup>
<col class="col-half" />
</colgroup>
<tbody>
@Html.AntiForgeryToken()
@Html.HiddenFor(m => m.CategoryId)
@Html.HiddenFor(m => m.TenantId)
<tr>
    <td>Category Name</td>
    <td><input type="text" name="CategoryName" class="form-control" placeholder="Name" aria-describedby="basic-addon1" v-bind:value="model.CategoryName"></td>
</tr>

</tbody>
</table>
</div>

<div class="modal-footer">
<button class="btn btn-success">Save Changes</button>
<button class="btn btn-danger" data-dismiss="modal">Cancel</button>
</div>

</div>
</div>
}

<script type="text/javascript">
$(document).ready(function () {
var app = new Vue({
el: '#categoriesUpdate',
data: {
model: @Html.Raw(Json.Encode(Model)),
errors3: @ViewData.ModelState

}
});
});

</script>

我想将ViewData错误传递给vue.js数据对象，以便我可以使用vue.js循环渲染

<ul id="example-1">
  <li v-for="item in items">
    {{ item.message }}
  </li>
</ul>

而不是

@if (ViewData.ModelState.Values.Any(x => x.Errors.Count >= 1))
{
 @Html.ValidationSummary()
}

我已经尝试了以下所有选项

1. 验证：@ ViewData.ModelState.Where（n =＆gt; n.Value.Errors.Count＆gt; 0）.ToList（），
  1. 错误：Json.Encode（@ ViewData.ModelState.Values.SelectMany（v =＆gt; v.Errors））;
  2. errors1：Json.Stringify（@ ViewData.ModelState.Values.SelectMany（v =＆gt; v.Errors））， 4.errors2：Json.Stringify（@ ViewData.ModelState.ToList（）[0]）， 5.errors3：Json.Stringify（@ ViewData.ModelState.ToList（）[0] .ToString（）），
  3. errors3：@ Html.Raw（Json.Encode（ViewData））

如何将Asp.Net MVC ViewData传递给vue.js数据对象

0 个答案: