Не удается открыть другую страницу при входе - PullRequest
Новая
       37

Не удается открыть другую страницу при входе

0 голосов
/ 07 апреля 2020

В настоящее время я использую vuejs в моем проекте, я создаю страницу входа, когда я ввожу имя пользователя и пароль в свой логин, она не может открыть другую страницу, когда я ввожу имя пользователя и пароль в форму входа, а затем нажимаю на Кнопка входа в систему очищает все поля, но не может открыть мою панель управления. my dashnoard id = "dboard"

Логин. vue

    <template>
    <div id="login">
      <CContainer class="d-flex content-center min-vh-100">
        <CRow>
          <CCol>
            <CCardGroup>
              <CCard class="p-4">
                <CCardBody>
                  <CForm>
                    <h1>Login</h1>
                    <p class="text-muted">Sign In to your account</p>
                    <CInput
                      placeholder="Username"
                      autocomplete="usernameemail"
                    >
                      <template #prepend-content><CIcon name="cil-user"/></template>
                    </CInput>
                    <CInput
                      placeholder="Password"
                      type="password"
                      autocomplete="curent-password"
                    >
                      <template #prepend-content><CIcon name="cil-lock-locked"/></template>
                    </CInput>
                    <CRow>
                      <CCol col="6" class="text-left">
                        <CButton color="primary" class="px-4" type="submit" @click="login()">Login</CButton>
                      </CCol>
                      <CCol col="6" class="text-right">
                        <CButton color="link" class="px-0">Forgot password?</CButton>
                        <CButton color="link" class="d-md-none">Register now!</CButton>
                      </CCol>
                    </CRow>
                  </CForm>
                </CCardBody>
              </CCard>
              <CCard
                color="primary"
                text-color="white"
                class="text-center py-5 d-sm-down-none"
                body-wrapper
              >
                <h2>Sign up</h2>
                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
                <CButton
                  color="primary"
                  class="active mt-3"
                >
                  Register Now!
                </CButton>
              </CCard>
            </CCardGroup>
          </CCol>
        </CRow>
      </CContainer>
    </div>
    </template>

    <script>
    export default {
      name: 'Login',
      data(){
       return{
         input:{
           usernameemail:"",
           password:""
         }
       }
      },
      methods:{
        login() {
                    if(this.input.usernameemail != "" && this.input.password != "") {
                        if(this.input.usernameemail == this.$parent.mockAccount.usernameemail && this.input.password == this.$parent.mockAccount.password) {
                            this.$emit("authenticated", true);
                            this.$router.replace({ name: "dboard" });
                        } else {
                            console.log("The username and / or password is incorrect");
                        }
                    } else {
                        console.log("A username and password must be present");
                    }
                }
            }
        }
    </script>

1 Ответ

0 голосов
/ 07 апреля 2020

Если все правильно, кроме метода this.$router.replace, попробуйте push вместо replace

this.$router.push({ name: "dboard" });
...