使用 vue.js 获取下拉列表的值

Question

我正在尝试获取下拉列表的值并使用 get 请求更改 div 内容 查看

 <div class="row row-mb2" id="Produit-tab">
 @Html.DropDownList("Version", new SelectList(ViewBag.Versions, "IdVersion", "VersionProduit"), new { @id = "version" })
 </div>

<div id="versiondetails"></div>

脚本：

 $.Produit.settingsView = new Vue({
            el: '#Produit-tab',
            data:
                {
                version:''
                },
            watch: {
                version: function (versionprod) {
                    $.get("@Url.Action("Details", "VersionProduit", new {id = "_PARAM_" })".replace("_PARAM_", versionprod), function (data) {

                        $('#VersionDetails').html(data);
                    });
                }
            }//,.....rest of the code 

我通常使用 vue.js 并使用 v-model="..." 进行输入 但是使用 razor 我无法注入 vue.js 属性，但我尝试了这个，但它 razor 不接受它

 @Html.DropDownList("Version", new SelectList(ViewBag.Versions, "IdVersion", "VersionProduit"), new { @id = "version" ,@v-Model="version" })

Answer 1

使用@v-Model 的@v_model insted 可以解决您的问题。

@Html.DropDownList("Version", new SelectList(ViewBag.Versions, "IdVersion", "VersionProduit"), new { @id = "version" ,@v_model="version" })