将选定的下拉值从 react js 发送到 django ORM答案

【问题标题】：Sending the selected dropdown value from react js to django ORM将选定的下拉值从 react js 发送到 django ORM
【发布时间】：2019-03-13 07:02:00
【问题描述】：

我在 react 中有前端代码，可以从下拉列表中给出所选值。我想将此值发送到 django views.py 文件，以便我可以在 ORM 中使用它进行过滤。下拉菜单的选项值也来自 django 后端。下拉列表中选择的值是用于 ORM 中过滤器的 Customer_Id 之一。

下面是反应代码。

import PropTypes from 'prop-types';
import React, { Component } from 'react';
import ReactSelect from 'react-select';

class Select extends React.Component {
     static propTypes = {
     onChange: PropTypes.func,
     name: PropTypes.string,
     value: PropTypes.string,
};

constructor(props) {
    super(props);

    this.state = {
    error: false,
    value: props.default,
};

this.handleChange = this.handleChange.bind(this);
}

handleChange(event) {
    this.setState({value: event.target.value});
}

render() {
   let dropdowns = this.props.state.dropdowns;
   let optionitems = dropdowns.map((dropdown) => {
        return(
          <option key={dropdown.auto_increment_id} value={dropdown.auto_increment_id}>
          {dropdown.customerName}
          </option>
        );
        }

  );

return (
  <div>
    <select value={this.state.value} onChange={this.handleChange}>
      Select Customer Name
      {optionitems}
    </select>
    <p>{this.state.value}</p> // want to send this value to views.py
  </div>
   );
  }
 }
export default Select;

下面是views.py代码：

from psiApp.models import Proactive,CustomersName
from psiApp.serializers import LogSerializer,CustSerializer
from rest_framework import generics

class ListView(generics.ListCreateAPIView):
    queryset = Proactive.objects.all() 
    //Want something like: Proactive.objects.filter(Customer_id=value from react)
    serializer_class = LogSerializer

我希望这个问题很清楚，我是刚接触 react 和 django 的新手。任何想法表示赞赏！将值从前端发送到后端对我来说是非常新鲜的事情。提前致谢。

【问题讨论】：

标签： django reactjs django-models orm django-rest-framework

【解决方案1】：

它需要一个 ajax 请求。万一有人在这里滚动。

【讨论】：