Как передать в Dotnet MVC значение из поля Vue?

Question

[Сергей]

Есть представление в dotnet core MVC. Мне нужно передать в контроллер массив из поля Vue.js. Подскажите, как это правильно сделать?

<form action="Home/Index" method="post">
    <div class="text-center">
    <div id="app">
        <p>
            <input type="text" v-model="newTag"/>
            <button v-on:click="tags.push(newTag)">+</button>
        </p>
        <ul>
            <li v-for="(tag, index) in tags">
                <p>{{tag}} <button v-on:click="tags.splice(index, 1)">-</button></p>
            </li>
        </ul>
         <!-- Вот тут мне нужно как-то передать в Контроллер массив строк из Vue app tags -->
        <input type="submit" name="submit" value="Отправить"/>
    </div>
        
    </div>
</form>
<script src="https://unpkg.com/vue"></script>
<script>
    var app = new Vue({
        el: '#app',
        data: {
            newTag: '',
            tags:[]
        }
    });
</script>

Спасибо!

Answer 1

[Владимир Коротенко]

в модель добавьте строку tags

в код



и добавьте computed

getTags: function(){
return this.tags.join(',');
}

Comments

[Сергей]

Да, модель есть. getTags добавлю, спасибо.
А вот перед input type=submit, мне тоже нужно добавть какой-то input type, принимающий getTags()? Как он должен выглядеть?

[Владимир Коротенко]

извиняюсь парсер сьел тэги
<inpyt type='hidden' name='tags' :value='getTags'

[Сергей]

Владимир Коротенко, Спасибо большое!

[Сергей]

Владимир Коротенко, Очевидно, getTags заработало, но возвращает не массив, а function() { [native code] }
В чём может быть проблема?

[Сергей]

Владимир Коротенко, Понял, спасибо!.

<inpyt type='hidden' name='tags' :value='getTags()'

Может быть ещё подскажете. Вызов Post срабатывает не в <input type="submit"
а в <button v-on:click="tags.push(newTag)">+</button>

С чем это может быть связано?

Спасибо!

[Владимир Коротенко]

По идее должна быть строка

https://jsfiddle.net/vkorotenko/2x08pnjk/

[Владимир Коротенко]

Сергей, кнопка имеет дефолтное поведение submit, если явно указать тип то все будет нормально
https://jsfiddle.net/vkorotenko/2x08pnjk/

[Владимир Коротенко]

И лучше обработчики вынести в методы, добавить проверку на пустые строки, дубли и т.д.
https://jsfiddle.net/vkorotenko/2x08pnjk/

[Сергей]

Владимир Коротенко, Ничёсе. Спасибо!!