Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/497.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181

Warning: file_get_contents(/data/phpspider/zhask/data//catemap/8/mysql/59.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 无法使用MySQL和ReactJS显示行_Javascript_Mysql_Node.js_Reactjs_Express - Fatal编程技术网

Javascript 无法使用MySQL和ReactJS显示行

Javascript 无法使用MySQL和ReactJS显示行,javascript,mysql,node.js,reactjs,express,Javascript,Mysql,Node.js,Reactjs,Express,我是新开发人员ReactJS,我开发了一个表,前端是ReactJS,后端是NodeJS,数据库是MySQL。我想在列表中获得带有Select request by Code(主键)的数据。 正如您在上面所看到的,我希望,当我单击view按钮时,它将引导我到列表页面,该行将被检索 我的客户: class ViewClient extends Component { constructor(props) { super(props); this.sta

我是新开发人员ReactJS,我开发了一个表,前端是ReactJS,后端是NodeJS,数据库是MySQL。我想在列表中获得带有Select request by Code(主键)的数据。

正如您在上面所看到的,我希望,当我单击view按钮时,它将引导我到列表页面,该行将被检索

我的客户:

class ViewClient extends Component {

    constructor(props) {
        super(props);


        this.state = {
            clients: []
        };

        this.toggle = this.toggle.bind(this);
        this.state = {
            activeTab: '1',
        };
    }

    toggle(tab) {
        if (this.state.activeTab !== tab) {
            this.setState({
                activeTab: tab,
            });
        }
    }
    componentDidMount() {
        var Code = this.props.Code;
        axios({
                method: "get",
                url: "/app/viewclient/?Code="+Code+",
                withCredentials: true,
                headers: {
                    "Access-Control-Allow-Origin": "*",
                    "Content-Type": "application/json",
                    Accept: "application/json"
                }
            })
            .then(response => {
                if (response && response.data) {
                    this.setState({ clients: response.data });
                }
            })
            .catch(error => console.log(error));
    }


    render() {
        let { clients } = this.state;
        return (
            <div className="animated fadeIn">
        <Row>
         
           <Col xs="12" md="6" className="mb-4">
            <Nav tabs>
              <NavItem>
                <NavLink
                  className={classnames({ active: this.state.activeTab === '1' })}
                  onClick={() => { this.toggle('1'); }}
                >
                  <i className="fa fa-info"></i> <span className={this.state.activeTab === '1' ? '' : 'd-none'}> Détails</span>
                </NavLink>
              </NavItem>
              <NavItem>
                <NavLink
                  className={classnames({ active: this.state.activeTab === '2' })}
                  onClick={() => { this.toggle('2'); }}
                >
                  <i className="fa fa-credit-card"></i> <span
                  className={this.state.activeTab === '2' ? '' : 'd-none'}> Factures</span>
                </NavLink>
              </NavItem>
              <NavItem>
                <NavLink
                  className={classnames({ active: this.state.activeTab === '3' })}
                  onClick={() => { this.toggle('3'); }}
                >
                  <i className="fa fa-truck"></i> <span className={this.state.activeTab === '3' ? '' : 'd-none'}> Bons de livraison</span>
                </NavLink>
              </NavItem>
            </Nav>
            <TabContent activeTab={this.state.activeTab} style={{ height:"420px"}}>
              <TabPane tabId="1">
               <ul>
               {
                       clients &&  clients.map(client => (
                            <li key={client.Code}>
                         <h1> Code client :    {client.Code} </h1>
                             {client.Prenom}
                              {client.Nom}
                              {client.FAX}
                             {client.Telephone}
                               {client.Email}
                                {client.Adresse1}
                                 {client.Adresse2}
               </li>
               ))}
               </ul>
              </TabPane>
              <TabPane tabId="2">
                
              </TabPane>
              <TabPane tabId="3">
              
              </TabPane>
            </TabContent>
          </Col>
          
        </Row>
      </div>
        );
    }
}

export default ViewClient;
我的服务器是:

router.get('/viewclient/:Code?', clients.viewclient);
当我运行它时,我进入控制台后端
[]
,在我的前端,没有显示任何内容,因为没有检索到行。
如何解决此问题?

错误是,Get方法不包含正文参数。正文参数仅在POST请求中可用。请尝试使用查询参数,因为您将代码作为
?code=
发送


在后端,使用
req.query.code
获取代码,而不是使用
req.body.code

我在路由器上更改它,如:
var code=req.query.code;connection.query(“从客户端选择代码、Prenom、Nom、传真、电话、电子邮件、地址1、地址2,其中代码=“+Code+””,函数(错误、结果、字段){在我的服务器上:router.get(“/viewclient/:Code?”,clients.viewclient);在我的前端:var Code=this.state.Code;axios({method:“get”,url:“/app/viewclient/:Code?”+Code,但前端没有显示任何内容,仍然是“[]'在我的后端日志中。您的url是错误的,它应该类似于
/app/viewclient?code=
它仍然是相同的问题,
选择code、Prenom、Nom、传真、电话、电子邮件、来自code=“+code+”的客户端的地址1、地址2'“
可能是我的Select查询中的一个问题吗?如果代码出现,您可以控制台并查看您是否在服务器上获取代码!这是mysql查询的一个问题。请尝试运行:
连接。查询('Select code,Prenom,Nom,传真,电话,电子邮件,Adresse1,Adresse2 FROM clients WHERE code=“1111”',函数(错误,结果,字段){
对于Postman,它工作得很好,但问题是当我将
code
放在
WHERE子句中时。。
router.get('/viewclient/:Code?', clients.viewclient);