JSFiddle - React, Tailwind, and code Playground

by All Laravel

HTML

<script src="https://unpkg.com/[email protected]/dist/vue.js"></script>
<div id="app">
  <h1 v-if="user.email == '[email protected]' && user.password == '123456'" style="color: green;">Chào mừng {{ user.email }} đã đăng nhập thành công!</h1>
  <h1 v-if="(user.email != '[email protected]' && user.email != null) || (user.password != '123456' && user.password != null)" style="color: red;">Thông tin đăng nhập sai, vui lòng thử lại!</h1>
  <br>
  <div v-if="user.email != '[email protected]' || user.password != '123456'">
    <label>Địa chỉ email</label>
    <input type="text" v-model="user.email">
    <br>
    <label>Mật khẩu</label>
    <input type="password" v-model="user.password">
  </div>

</div>

JavaScript

new Vue({
  el: '#app',
  data: {
    user: {}
  }
})