vue-router—14案例:模擬登錄跳轉

login.vue

<template>
  <div class="login">
    <div class="login-box">
      <h2>登錄</h2>
      <form @submit.prevent='sendLogin' autocomplete="off">
        <div><input placeholder="請輸入用戶名" type="text" name="user" ref="userInput" /></div>
        <div><input placeholder="請輸入密碼" type="password" name="password" /></div>
        <div class="login-btn"><input type="submit" value="一鍵登入" /></div>
      </form>
      <div class="back-index">
        <router-link  to="/">首頁>>></router-link>
      </div>
    </div>
  </div>
</template>

<script>
  export default {
    name: 'login',
    data () {
      return {}
    },
    methods: {
      sendLogin () {
          // 登錄
        let username = this.$refs.userInput.value;
        this.$local.save("miaov", {
          login:true,
          userName:username
        })
        this.$router.push('/');

      }
    }
  }
</script>
<style>

</style>

index.js 

home.vue 

 看下如何存用戶信息

 

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章