Не удается получить данные в форме реакции на Django - PullRequest
Новая
       12

Не удается получить данные в форме реакции на Django

0 голосов
/ 11 июля 2020

Я столкнулся с этой проблемой, когда пытался передать данные в форме на сервер Django. Прежде всего, предупреждающее сообщение (определенное в файле login js) говорит, что и имя пользователя, и пароль - undefined. Используемая среда React - это дизайн муравьев. enter image description here

Here is the code:

login.js (comment markers are provided along the way)

import React from "react";
import ReactDOM from "react-dom";
import "antd/dist/antd.css";
import { Form, Input, Button, Checkbox, Row, Col } from "antd";
import { UserOutlined, LockOutlined } from "@ant-design/icons";
import jQuery from 'jquery';

function getCookie(name) {
  let cookieValue = null;
  if (document.cookie && document.cookie !== '') {
    let cookies = document.cookie.split(';');
    for (let i = 0; i < cookies.length; i++) {
      let cookie = jQuery.trim(cookies[i]);
      if (cookie.substring(0, name.length + 1) === (name + '=')) {
          cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
          break;
      }
    }
  }
  return cookieValue;
}

class NormalLoginForm extends React.Component {
  constructor(props) {
    super(props);
    this.state = {username: '', password: ''};                         // <-- initial states

    this.handleUsernameChange = this.handleUsernameChange.bind(this);
    this.handlePasswordChange = this.handlePasswordChange.bind(this);
    this.handleSubmit = this.handleSubmit.bind(this);
  }

  handleUsernameChange(event) {
    this.setState({username: event.target.username});
  }
  handlePasswordChange(event) {
    this.setState({password: event.target.password});
  }

  handleSubmit(event) {
    alert('A name was submitted: ' + this.state.username);             // <-- here are the alerts
    alert('Password is: ' + this.state.password);
    event.preventDefault();

    let csrftoken = getCookie('csrftoken');

    fetch('/account/login/', {
      credentials: 'include',
      method: 'POST',
      headers: {
        'Content-Type': 'application/json', 'X-CSRFToken': csrftoken,
      },
      body: {
        "username": this.state.username,
        "password": this.state.password
      }
    })
    .then((response) => {console.log('message: ', response);})
    .catch((error) => {console.error('Error:', error);});
  }

  render () {
    return (
       } placeholder = "Имя пользователя" /> } type = "password" placeholder = "Пароль" /> Запомнить меня  Забыл пароль  // <- отправка формы Войти </Button> Или зарегистрируйтесь сейчас!    )}}; ReactDOM.render ( , document.getElementById ("root"));

views.py 

class UserLoginView(View):
    form_class = LoginForm
    initial = {'key': 'value'}
    template_name = 'accounts/auth/auth-login.html'
    
    def get(self, request, *args, **kwargs):
        form = self.form_class(initial=self.initial)
        return render(request, self.template_name, {'form': form})

    def post(self, request, *args, **kwargs):
        form = self.form_class(request.POST)

        print("posted")

        if form.is_valid():
            username = request.POST['username']
            password = request.POST['password']
            user = authenticate(request, username=username, password=password)
            print("valid")
            if user is not None:
                login(request, user)
                print("logged in")
                return redirect('index')

forms.py 

class UpdateFormBase(ModelForm):
    def __init__(self, *args, **kwargs):
        super().__init__(*args, **kwargs)
        password = self.fields.get('password')
        if password:
            password.help_text = password.help_text.format('../password/')
        user_permissions = self.fields.get('user_permissions')
        if user_permissions:
            user_permissions.queryset = user_permissions.queryset.select_related('content_type')

    def clean_password(self):
        return self.initial.get('password')

    class Meta:
        model = User
        fields = '__all__'


class LoginForm(UpdateFormBase):
    class Meta:
        model = User
        fields = ('first_name', 'password')

Итак, все сводится к проблема в том, что я не могу получить данные из полей формы, когда появились предупреждения (это означает, что отправка обработана), но я не могу понять причину этого.

Для python файла, просто предположите, что все используемые методы и переменные объявлены.

Помощь приветствуется.

...