Выпадающий список выбора Vue в контроллере MVC

#asp.net-mvc #vue.js #model-view-controller #dropdown #viewmodel

Вопрос:

Я пытаюсь использовать vue istance с MVC, но получаю сообщение об ошибке:

[Предупреждение Vue]: У вас может быть бесконечный цикл обновления в функции рендеринга компонента.

Я создал контроллер MVC, чтобы получить представление с помощью ViewModel:

Модель представления

 public class HomeViewModel
{
    public string JumbotronTitle { get; set; }
    public string JumbotronDescription { get; set; }
    public List<int> Numbers { get; set; }
}
 

Домашний контролер

 public class HomeController : Controller
{
    [HttpGet]
    public ActionResult Index()
    {
        var vm = new HomeViewModel
        {
            JumbotronTitle = "Title from view model",
            JumbotronDescription = "Description from view model",
            Numbers = new List<int>() { 1, 2, 3, 4, 5 }
        };
        return View(vm);
    }
}
 

Индекс.cshtml

 @using WebApplication_VueJS.Models
@model HomeViewModel

<div class="jumbotron" id="jumbotron-section" :initialJumboValues='setJumbotronValues(@Html.Raw(Json.Encode(Model)))' v-cloak>    
    <select class="form-control" v-model="selected">
        <option v-for="number in jumbotronObj.Numbers" :value="number">{{ number }}</option>
    </select>
    <span>Test: {{ selected }}</span>
</div>

<script>
    new Vue({
        el: '#jumbotron-section',
        data: {
            initialJumboValues: '',
            jumbotronObj: {},
            selected: null,
        },
        methods: {
            setJumbotronValues: function (vm) {
                this.jumbotronObj = vm;                
            }
        }
    });
</script>
 

Раскрывающийся список работает, но в консоли у меня есть эта ошибка. Как я могу это исправить?

Заранее спасибо

R1