WeChat-Applet implementiert Anmeldeschnittstelle

<Klasse anzeigen="Container">
  <Klasse anzeigen="Wrapper">
    <view class="left-top-sign">ANMELDEN</view>
    <view class="willkommen">
      Willkommen zurück!
    </Ansicht>
    <Klasse anzeigen="Eingabeinhalt">
      <Ansichtsklasse="Eingabeelement">
        <text class="tit">Mobiltelefonnummer</text>
        <input type="text" placeholder="Bitte geben Sie Ihre Telefonnummer ein" id='phone' data-type='phone' bindinput='handerInput' />
      </Ansicht>
      <Ansichtsklasse="Eingabeelement">
        <text class="tit">Passwort</text>
        <input type="password" placeholder="Bitte geben Sie Ihr Passwort ein" id='password' data-type='password' bindinput='handerInput' />
      </Ansicht>
    </Ansicht>
    <button class="confirm-btn">Anmelden</button>
    <view Klasse="Abschnitt vergessen">
      Passwort vergessen?
    </Ansicht>
  </Ansicht>
  <view Klasse="Register-Abschnitt">
    Noch kein Konto?
    <text>Jetzt registrieren</text>
  </Ansicht>
</Ansicht>

Daten: {
    Telefon: '', //Telefonnummer Passwort: '' //Passwort},

  /**
   * Lebenszyklusfunktion - auf Seitenladen warten*/
  onLoad: Funktion (Optionen) {

  },
  handerInput(Ereignis) {
    //let Typ = Ereignis.currentTarget.dataset.type;
    let Typ = Ereignis.currentTarget.id;
    console.log(Ereignis);
    dies.setData({
      [Typ]: Ereignis.Detail.Wert
   })
  },
  /**

//html
<button class="confirm-btn" bindtap="login">Anmelden</button>

//js
anmelden() {
    let { Telefon, Passwort } = this.data;
    console.log(Passwort);
    /**
     * Telefonnummernüberprüfung* Telefonnummer ist leer* Telefonnummernformat ist falsch* Telefonnummer ist korrekt*/
    wenn (!Telefon) {
      wx.showToast({
        Titel: „Mobilfunknummer darf nicht leer sein“,
        Symbol: „keine“
      })
      zurückkehren;
    }
    //Definieren Sie den regulären Ausdruck für die Telefonnummer let phoneReg = /^1(3|4|5|6|7|8|9)\d{9}$/
    wenn (!phoneReg.test(Telefon)) {
      wx.showToast({
        Titel: 'Das Format der Handynummer ist falsch',
        Symbol: „keine“
      })
      zurückkehren;
    }

    if (!Passwort) {
      wx.showToast({
        Titel: 'Das Passwort darf nicht leer sein',
        Symbol: „keine“
      })
      zurückkehren;
    }

    wx.showToast({
      Titel: „Front-End-Verifizierung bestanden“

    })

let result = await request('/login/cellphone', { Telefon, Passwort });
    wenn (Ergebniscode === 200) {
      wx.showToast({
        Titel: „Anmeldung erfolgreich“,
      })
    }
    sonst wenn (Ergebniscode === 400) {
      wx.showToast({
        Titel: 'Falsche Telefonnummer',
        Symbol: „keine“
      })
    }
    sonst wenn (Ergebniscode === 502) {
      wx.showToast({
        Titel: 'Falsches Passwort',
        Symbol: „keine“
      })
    }
    anders {
      wx.showToast({
        Titel: 'Anmeldung fehlgeschlagen, bitte melden Sie sich erneut an',
        Symbol: „keine“
      })
    }
},

<view class="Benutzerinfo-Box" bindtap='toLogin'>
      <Ansichtsklasse="Portrait-Box">
        <Bildklasse="Porträt"
          src='{{userInfo.avatarUrl?userInfo.avatarUrl:"/static/images/personal/missing-face.png"}}'></image>
      </Ansicht>
      <Klasse anzeigen="Info-Box">
        <text class="username">{{userInfo.nickname?userInfo.nickname: 'Besucher'}}</text>
      </Ansicht>
</Ansicht>

//login.js
wenn (Ergebniscode === 200) {
      wx.showToast({
        Titel: „Anmeldung erfolgreich“,
      })

      wx.setStorageSync('Benutzerinfo', JSON.stringify(Ergebnis.Profil));

      wx.switchTab({
        URL: '/Seiten/persönlich/persönlich'
      })
    }
// persönlich.js
onLoad: Funktion (Optionen) {

    let userInfo = wx.getStorageSync('userInfo');
    if (Benutzerinfo) {
      dies.setData({
        Benutzerinfo: JSON.parse(Benutzerinfo)
      })
    }

  },