用户简单登录小案例 

 <!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
<div id="app">

  <span v-if="isUser">
<!--    虚拟dom默认复用，使用key-->
    <label for="username"> 用户账号</label>
    <input type="text" id="username" key="us">
  </span>
  <span v-else>
    <label for="email">用户邮箱</label>
    <input type="text" id="email" key="em">
  </span>
  <button @click="isUer=!isUser">切换</button>
</div>
<script src="../vue.js"></script>
<script>

  const  app=new Vue({
    el:'#app',
    data:{
       isUser:true
    },
    computed:{

    }


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

 

posted @ 2021-04-12 11:11  好吗，好  阅读(23)  评论(0)    收藏  举报