为什么我的 MVC RazorView textarea 在我将它绑定到 VueJS v-model 时被清除？

Question

这是我的 cshtml：

@Html.TextAreaFor(model => model.Content, new { @class="form-control", @style = "max-width:800px", @v_model = "content" })

这是我的 VueJs...

var app = new Vue({
    el: '#app-pagecontent-edit',
    data: {
        editorType: 'plainText',
        content: ''
    },
    methods: {
    }
})

问题是最初由 MVC 视图模型填充的数据未显示。它正在加载时被清除。这里发生了什么？我需要 MVC 和 VueJS 之间的双向绑定。

Answer 1

这在Vue中有描述documentation

v-model will ignore the initial value, checked, or selected attributes found on any form elements. It will always treat the Vue instance data as the source of truth. You should declare the initial value on the JavaScript side, inside the data option of your component.

如果你的 Vue 应用程序源代码是同一个 MVC 视图的一部分，你可以在那里分配初始值，但我不推荐这样做，因为结果难以阅读和维护

唯一的其他方法是使用某种技术以其他方式存储初始值并在创建组件时初始化 v-model。您可以找到一些解决方案 - 使用自定义指令似乎是一个非常清晰和优雅的解决方案...

为什么我的 MVC RazorView textarea 在我将它绑定到 VueJS v-model 时被清除？

Why is my MVC RazorView textarea being cleared when I bind it to VueJS v-model?

model-view-controller

asp.net-mvc

vue.js

vuejs2