vue後臺管理系統學習(4)--登錄頁面改造

 今天又看了花褲衩的項目，感覺受益匪淺，順便再研究下vue,

項目地址：https://github.com/PanJiaChen/vue-element-admin

 大家下載項目的話，建議下載 i18n這個分支，這個分支默認是中文版，廢話不說，切入正題

 1.首先看下登錄也的效果圖

   把頁面中多餘的東西都去除掉了，保持清爽

   

2. 代碼

    $t 表示使用了i18n國際化組件，使用這個標識是爲了方便國際化

     {{ $t('login.title') }}    login這個變量是在src/lang/zh.js這個文件中定義的，裏面包括多個變量，大家可以打開這個文件看下

    

  login: {
    title: '百事幫物業運行後臺',
    logIn: '登錄',
    username: '賬號',
    password: '密碼',
    any: '隨便填',
    thirdparty: '第三方登錄',
    thirdpartyTips: '本地不能模擬，請結合自己業務進行模擬！！！'
  },

3. 應用文件的路徑

   

import LangSelect from '@/components/LangSelect'

@等價於 /src 這個目錄 ,表示在這個目錄下的文件夾

import SocialSign from './components/SocialSignin

./: 當前目錄下

../: 父級目錄