class

src/components/classify/courselist.js

@@ -3,7 +3,7 @@ import {VList} from '../../common';
 import {Tabs, WhiteSpace} from 'antd-mobile';
 import './courselist.scss';
 import HeaderSearch from '../../common/HeaderSearch/index'
-import {api} from "@/utils";
+import {api, getParam} from "@/utils";
 
 
 class Classify extends Component {
@@ -14,39 +14,43 @@ class Classify extends Component {
             display: 'none',
             arr: [{basics: []}, {advanced: []}],
             allClass: [],
-            data: []
+            data: [],
         }
 
     }
 
     componentDidMount() {
         this.getTabs()
-        this.getList('20')
-        console.log(this.props)
+        this.getList(getParam('id'))
     }
+
     // 获取tabs接口
     getTabs = () => {
         let data = 0
-        api.get(`/m/course/classify/${data}`,).then((res) => {
-            const _this = this
-            if (res.data.code === 200) {
-                if (res.data.data.common.length > 0) {
-                    let arr = ['basics', 'advanced']
-                    let arr2 = [{basics: []}, {advanced: []}]
-                    let arr3 = []
-                    arr.forEach(function (item, index) {
-                        arr2[item] = res.data.data.common[index]
-                        res.data.data.common[index].list.forEach(function (item, index) {
-                            arr3.push({'title':item.c_name,'id':item.c_id})
+        api.get(`/m/course/classify/${data}`,)
+            .then((res) => {
+                const _this = this
+                if (res.data.code === 200) {
+                    if (res.data.data.common.length > 0) {
+                        let arr = ['basics', 'advanced']
+                        let arr2 = [{basics: []}, {advanced: []}]
+                        let arr3 = []
+                        arr.forEach(function (item, index) {
+                            arr2[item] = res.data.data.common[index]
+                            res.data.data.common[index].list.forEach(function (item, index) {
+                                arr3.push({'title': item.c_name, 'id': item.c_id})
+                            })
                         })
-                    })
-                    _this.setState({
-                        arr: arr2,
-                        allClass: arr3
-                    })
+                        _this.setState({
+                            arr: arr2,
+                            allClass: arr3
+                        })
+                    }
                 }
-            }
-        })
+            })
+            .catch(err => {
+                console.log(err)
+            })
     }
 
     // 获取课程接口
@@ -79,13 +83,12 @@ class Classify extends Component {
     }
 
     // 弹窗里面tab点击查询
-    labelclick = (id) => {
+    labelclick = (id,index) => {
         this.getList(id)
-
         this.setState(status => ({
             ispull: !status.ispull,
             display: status.ispull ? 'none' : 'block'
-        }));
+        }))
     }
 
     render() {
@@ -111,7 +114,7 @@ class Classify extends Component {
                     >
                         <div className='tabs'>
                             <ul>
-                                {this.state.data && this.state.data.length>0 && this.state.data.map((item, index) => {
+                                {this.state.data && this.state.data.length > 0 && this.state.data.map((item, index) => {
                                     const Info = (
                                         <div className="info">
                                             <p className='title'>{item.course_title}</p>
@@ -175,7 +178,7 @@ function ClassCourse(props) {
                 {
                     props.data && props.data.length > 0 && props.data.map((item, index) => {
                         return (
-                            <span key={index} onClick={e => props.labelclick(item.c_id)}
+                            <span key={index} onClick={e => props.labelclick(item.c_id,index)}
                                   className='item-label'>{item.c_name}</span>
                         )
                     })

src/components/classify/index.js

@@ -2,6 +2,7 @@ import React, {Component} from 'react';
 import {WithTab} from '@/HOCs'
 import './index.scss';
 import {api} from "@/utils";
+import { Link } from 'react-router-dom'
 
 class Classify extends Component {
     constructor(props) {
@@ -38,19 +39,14 @@ class Classify extends Component {
         })
     }
 
-    toClassList =(id)=>{
-        console.log(id)
-        // this.props.history.push({pathname: `/courselist?id=${id}`})
-    }
-
     render() {
         return (
             <div className='class-box'>
                 <div className="class-title">分类</div>
                 <ClassCourseBox data={this.state.camp.list} title={this.state.camp.name} type={1} />
                 <ClassCourseBox data={this.state.employment.list} title={this.state.employment.name} type={1}/>
-                <ClassCourseBox data={this.state.basics.list} title={this.state.basics.name}  type={2} toClassList={this.toClassList}/>
-                <ClassCourseBox data={this.state.advanced.list} title={this.state.advanced.name} type={2} toClassList={this.toClassList}/>
+                <ClassCourseBox data={this.state.basics.list} title={this.state.basics.name}  type={2}/>
+                <ClassCourseBox data={this.state.advanced.list} title={this.state.advanced.name} type={2}/>
                 <div className="vip">
                     {this.state.special.list && this.state.special.list.length > 0 && this.state.special.list.map((item, index) => {
                         return (
@@ -87,7 +83,9 @@ function ClassCourseB(props) {
             {
                 props.data && props.data.length > 0 && props.data.map((item, index) => {
                     return (
-                        <span onClick={e => props.toClassList(item.c_id)} key={index} className='item-label'>{item.c_name}</span>
+                        <Link to={`/courselist?id=${item.c_id}`} key={index} className='item-label'>
+                            {item.c_name}
+                        </Link>
                     )
                 })
             }
@@ -103,10 +101,10 @@ function ClassCourseBox(props) {
                 {props.title}
             </p>
             {props.type === 1 &&
-            <ClassCourseA data={props.data} toClassList={props.toClassList}/>
+            <ClassCourseA data={props.data}/>
             }
             {props.type === 2 &&
-            <ClassCourseB data={props.data} toClassList={props.toClassList}/>
+            <ClassCourseB data={props.data}/>
             }
         </div>
     )