来自Laravel时的v型默认值

表单中的所有输入都通过v-model绑定到Vue组件中的数据，如下所示

<validation-provider name="first_name" rules="required" v-slot="{ failed, errors }" :debounce="500">
<input  type="text" 
        id="first_name" 
        name="first_name" 
        placeholder="First name"
        class="form-control"
        :class="{'is-invalid' : failed}"
        :disabled="loading"
        value="{{ auth()->user()->first_name }}"
        tabindex="1"
        v-model.trim="user.first_name"
>
<div class="invalid-feedback" v-show="failed">
         @{{ errors[0] }}
</div>

data() {
        return {
            user: {
                first_name: document.querySelector("input[name=first_name]").value,
            },

            loading: false
        };
    },

---

但我很确定这不是最好的方法。我试着寻找答案，但都差不多。最好的方法是什么？

您必须找到将用户信息传递给（vue）js的方法。您的解决方案没有错，但在vue.js中，我们处理数据或状态，因此我的解决方案是为该问题创建自定义组件，如：

//刀片
//组件数据
数据（）{
返回{
用户：这个.data，
加载：错误
//你需要什么
};
},

当然还有另一种方法，您可以将用户数据放在blade文件的窗口DOM对象throw head标记中。在这里：

@auth
window.user=@json（auth（）->user（））
@endauth

然后，您可以在组件中访问它：

data（）{
返回{
用户：{
first\u name:window.user.first\u name
},
加载：错误
};
},

您使用的是

值

道具以及

v型

，这是冲突的

v-model

只不过是两种东西的组合，一种是

值

道具，另一种是

输入

事件侦听器。请阅读更多关于这个主题的文章。第一个技巧之一还提到，当使用

v-model

时，将忽略

值

道具。是的，我读过这篇文章，但可能我不理解。因此，我是否应该使用该值并尝试以另一种方式将输入绑定到数据属性，而不是使用v-model？使用v-model进行绑定。你不需要使用value属性，我需要。这是一个设置表单，所以我已经在数据库中保存了来自laravel的值，如果有，我想显示这些值