搜索

首页  >  问答  >  正文

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的值并没有显示出来。请问这样写是不是错的?要实现我的需求应该怎么写?

phpcn_u1582phpcn_u15822809 天前865

全部回复(5)我来回复

  • 天蓬老师

    天蓬老师2017-07-05 10:39:57

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

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

    回复
    0
  • 怪我咯

    怪我咯2017-07-05 10:39:57

    建议把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也就改变了

    回复
    0
  • 巴扎黑

    巴扎黑2017-07-05 10:39:57

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

    回复
    0
  • 代言

    代言2017-07-05 10:39:57

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

    回复
    0
  • 淡淡烟草味

    淡淡烟草味2017-07-05 10:39:57

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

    回复
    0
  • 取消回复