vue.js - установить начальное значение модели из модели представления .NET

Question

У меня есть эта строка:

<label><input style="margin-top:0" type="checkbox" asp-for="Properties.IsThisChecked" v-model="isThisChecked" /> Is This Checked?</label>
<div v-show="isThisChecked">
<!-- other code...

Он привязан как к модели Vue JS (isThisChecked), так и к свойству модели представления .NET (Propertied.IsThisChecked). Я уже знаю, что v-модель игнорирует все заданные значения в HTML и вместо этого принимает свое инициализированное значение. Но мне нужно начальное значение из модели представления .NET.

Как я могу получить это?

Answer 1

Вы сериализуете модель и инициализируете Vue следующим образом:

let data = @Html.Raw(Json.Encode(Model));
let vm = new Vue({
    ...
    data: data
});

ОБНОВЛЕНИЕ

Если вы не хотите сериализовать всю модель, это нормально: просто сериализуйте части, которые вам нужны.В некоторых случаях сериализация может не понадобиться вообще.Например, если требуемое свойство уже является примитивным типом, таким как строка или int.По существу:

data: {
    someString: "@Model.SomeString",
    someInt: @Model.SomeInt,
    someList: @Html.Raw(Json.Encode(Model.SomeList)),
    // etc.
}