javascript - 如何将 html 输入数据传递给 javascript 类

Question

我正在尝试将数据从 html 输入传递到 vanilla JS 类构造函数。这是我尝试过的。

class Users {
  constructor(email,password) {
    this.email = email;
    this.password = password;

  }


  login(){
      // url for endpoint
let url = "http://127.0.0.1:5000/api/v2/users/login"

alert(this.password)

// get login data from ui
let data = {
  email : this.email,
  password : this.password
};

}
let email = document.getElementById('email').value,
let password = document.getElementById('password').value
const user = new Users(email,password)
document.getElementById('login').addEventListener('submit', user.login())

似乎没有数据传递给电子邮件和密码变量。

我也尝试过这样做，但没有调用该对象

class Users {
  constructor(email,password) {
    this.email = email;
    this.password = password;

  }

        login(){
    // user the data here

}
function load(event){
   let email = document.getElementById('email').value,
   let password = document.getElementById('password').value
   const user = new Users(email,password)
   user.login()
}

document.getElementById('login').addEventListener('submit', load)

有人帮我解决这个问题。

标签： javascriptes6-class

Answer 1

我已尽力重构您的代码。根据您要对数据执行的操作，这取决于您。但是在下面的代码中，您可以在登录功能中获取电子邮件和密码

class Users {
  constructor() {    
  }
  
  login(){
    
    let email = document.getElementById('email').value, 
        password = document.getElementById('password').value
    
    alert(email, password)
  }
}

    
const user = new Users();
const login = user.login

<input type="text" id="email" />
<input type="text" id="password" />
<button id="login" onclick="login()">submit</button>