vue v-model :

v-model :

通过v-model 进行双向绑定 ,将data的数据与input 绑定在一起,呈现在页面上

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>vue入门</title>
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/vue.js"></script>
</head>
<body>
  <div id="first">
       姓氏:<input v-model="firstname"/><br>
       名字:<input v-model="lastname"/>
       <div>{{firstname}}{{lastname}}</div>
  </div>
  <script>
      new  Vue({
        el:"#first",
        data:{
           firstname:'',
           lastname:''
        }

      })
  </script>
</body>
</html>

  效果:

 2018-05-01  23:40:46

猜你喜欢

转载自www.cnblogs.com/guangzhou11/p/8978094.html