Question

您好，我是新来的反应者，正在尝试创建一个电子商务网站。我在代码中遇到了特定问题。

从上面的屏幕快照中可以看到，我的网站导航。

每当我尝试单击“服装”->“女孩”下的“鞋子”链接时，它都不会重定向到新页面。

我不知道哪里弄错了。谁能指导我。或深入了解如何进行。

我的代码sanbox链接：

我的mainCategory Js

import React, { Component } from 'react';
import axios from 'axios';
import SubMenu from './subMenu';



class Navigation extends Component {

  state = {
    mainCategory: []
  }

  componentDidMount() {
    axios.get('http://localhost:3030/topCategory')
      .then(res => {
        console.log(res.data.express);
        this.setState({
          mainCategory: res.data.express.catalogGroupView
        })
      })
  }



  render() {

    const { mainCategory } = this.state;
    return mainCategory.map(navList => {
      return (

        <ul className="header">
          <li key={navList.uniqueID}>
            <a className="dropbtn ">{navList.name} </a>
              <ul className="dropdown-content">
                <SubMenu below={navList.catalogGroupView} />
              </ul>


          </li>
        </ul>

      )

    })

  }


}

export default Navigation;

server.js

const express = require('express');
const cors = require('cors');
const Client = require('node-rest-client').Client;//import it here
const app = express();

app.use(cors());



app.get('/PDP', (req, res) => {

   var client = new Client();

   // direct way
   client.get("http://149.129.128.3:3737/search/resources/store/1/productview/byId/12501", (data, response) => {
    res.send({ express: data });
   });
});

app.get('/topCategory', (req, res) => {

    var client = new Client();

    // direct way
    client.get("http://149.129.128.3:3737/search/resources/store/1/categoryview/@top?depthAndLimit=-1,-1,-1,-1", (data, response) => {
     res.send({ express: data });
    });
 });

 app.get('/GirlShoeCategory', (req, res) => {

    var client = new Client();

    // direct way
    client.get("http://149.129.128.3:3737/search/resources/store/1/productview/byCategory/10015", (data, response) => {
     res.send({ express: data });
    });
 });






const port = 3030;
app.listen(port, () => console.log(`Server running on port${port}`));

Answer 1

请您提供一个mainCategory的示例，因为您正在从本地计算机上获取它，因此它在您的代码和框中产生了错误。

分类列表导航在React App中不起作用

1 个答案: