Перенаправление в vue на основе ответа - PullRequest
Новая
       8

Перенаправление в vue на основе ответа

0 голосов
/ 30 апреля 2018

Так что я пытаюсь загрузить клиентскую панель управления или админдаш, основываясь на том, кто входит в систему. Это мой первый раз, когда я касаюсь Vue, поэтому я не уверен на 100%, что это вообще возможно, но я подумал, что кто-то знал это были бы вы, ребята, здесь. Итак, вот мой код: 

export default {
    data () {
      return {
        model: {
          email: '',
          password: '',

        },
        modelValidations: {
          email: {
            required: true,
            email: true
          },
          password: {
            required: true,
            min: 5
          }
        },
      }
    },
    methods: {
      getError(fieldName) {
        return this.errors.first(fieldName)
      },
      validate() {


          let login = this;
          this.$auth.login({
            params: {
              email: login.model.email,
              password: login.model.password
            },
            success: function (response){
              console.log(response);
              let id = response.data.userinfo.id;
            },
            error: function (error) { 
              console.log(error); 
            },
              // rememberMe: true,
              // fetchUser: true,
          }).then(function(id) {
            if (id ==1) {
              this.$router.push('/admindashboard');
            } else {
              this.$router.push('/clientdashboard');
            }
          });
      }
    }
}

1 Ответ

0 голосов
/ 30 апреля 2018

Ваш маршрутизатор должен работать нормально, за исключением того, что вы нажали неверное имя / путь.

Ниже приведен один простой пример Vue-Router: программная навигация : 

let UserView = Vue.component('user', {
  template: '<div>I am User</div>'
})

let AdminView = Vue.component('admin', {
  template: '<div>I am Admin</div>'
})

const router = new VueRouter({
  routes: [
    {
      path: '/Admin',
      name: 'Admin',
      component: AdminView
    },
    {
      path: '/User',
      name: 'User',
      component: UserView
    }
  ]
})
Vue.use(VueRouter)
app = new Vue({
  el: "#app",
  router,
  data: {
    isAdmin: true,
    loading: ''
  },
  methods: {
    goNextView: function () {
      this.loading = 'Loding View...'
      setTimeout( ()=> {
        this.isAdmin = !this.isAdmin
        if(this.isAdmin){
          this.$router.push({name: 'Admin', path: '/Admin'})
        } else {
          this.$router.push({name: 'User', path: '/User'})
        }
        this.loading = ''
      }, 1000)
    }
  }
})
.loading {
  background-color:red;
  font-weight:bold;
}
<script src="https://unpkg.com/vue@2.5.16/dist/vue.js"></script>
<script src="https://unpkg.com/vue-router/dist/vue-router.js"></script>
<div id="app">
    <h2>Test Vue Router</h2>
    <p>Current Auth: {{isAdmin ? 'Admin' : 'User'}}</p>
    <button @click="goNextView()">Go to Next View</button>
    <p class="loading" v-if="loading">{{loading}}</p>
    <router-view></router-view>
</div>
...