javascript - input 是不是不能同时用：value和v-model

问题描述

<template> <p id='login'><p> 用户: <input type='text' v-model='username' :value=’info.name’> 密码: <input type ='text' v-model='password' :value=’info.psd’></p> </p></template><script> export default{name:’login’,data(){ return{username:’’,password:’’,info:{ name:’123’, psd:’123’,}, }}, }</script>

我想让input最初显示的是info里面的值，然后可以用v-model的值，但是不能达到效果。info的值并没有显示出来。请问这样写是不是错的？要实现我的需求应该怎么写？

问题解答

return{username:’123’,password:’123’, }

反正是双向的，何必多出来呢。

建议把v-bind:value去掉，直接把info.name和info.psd写到v-model上面，代码如下：

<template> <p id='login'><p> 用户: <input type='text' v-model='username'> 密码: <input type ='text' v-model='password'></p> </p></template><script> export default{name:’login’,data(){ return{username:’123’,password:’123’,info:{ name:’123’, psd:’123’,}, }}, }</script>

当input的value改变的时候，username和password也就改变了

v-model 就是 v-bind:input 和 v-bind:value 的语法糖。

已解决，用一个input和一个p配合即可

https://jsfiddle.net/stardew/...