to course detail modify

src/components/classify/index.js

@@ -6,8 +6,10 @@ import {Link} from 'react-router-dom'
 import {Toast} from 'antd-mobile'
 import {HeaderBar} from "@/common"
 import Loading from '@/common/Loading'
+import {connet} from 'react-redux';
+import {getCourses} from './../detail/actions';
 
-
+@connet()
 class Classify extends Component {
     constructor(props) {
         super(props)
@@ -50,21 +52,31 @@ class Classify extends Component {
         })
     }
 
+    toCourseDetail = (id) => {
+        const { dispatch, history } = this.props;
+        dispatch(getCourses(id, () => {
+            history.push(`/detail?id=${id}`);
+            return false;
+        }));
+    }
+
     render() {
         return (
             <div className='class-box'>
                 <HeaderBar title='分类' arrow={false} cart={false}></HeaderBar>
                 <Loading isLoading={this.state.isLoading}>
-                    <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}/>
-                    <ClassCourseBox data={this.state.advanced.list} title={this.state.advanced.name} type={2}/>
+                    <ClassCourseBox toDetail={this.toCourseDetail} data={this.state.camp.list} title={this.state.camp.name} type={1}/>
+                    <ClassCourseBox toDetail={this.toCourseDetail} data={this.state.employment.list} title={this.state.employment.name} type={1}/>
+                    <ClassCourseBox toDetail={this.toCourseDetail} data={this.state.basics.list} title={this.state.basics.name} type={2}/>
+                    <ClassCourseBox toDetail={this.toCourseDetail} 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 (
-                                <Link key={index} to={`/detail?id=${item.course_id}`}>
+                                <a href="javascript:;" onClick={() => this.toCourseDetail(item.course_id)} key={index}>
+                                {/* <Link key={index} to={`/detail?id=${item.course_id}`}> */}
                                     <img src={item.course_img} alt=""/>
-                                </Link>
+                                {/* </Link> */}
+                                </a>
                             )
                         })
                         }
@@ -76,19 +88,21 @@ class Classify extends Component {
 }
 
 // 课程图片形式展示 点击图片直接跳转课程详情页面
-function ClassCourseA({data}) {
+function ClassCourseA({data, toDetail}) {
     return (
         <div className='items-box'>
             {
                 data && data.length > 0 && data.map((item, index) => {
                     return (
-                        <Link to={`/detail?id=${item.course_id}`} key={index} className='item-banner'>
+                        <a href="javascript:;" onClick={() => toDetail(item.course_id)} key={index} className='item-banner'>
+                        {/* <Link to={`/detail?id=${item.course_id}`} key={index} className='item-banner'> */}
                             <img src={item.course_img} alt=""/>
                             {
                                 (item.is_aist &&
                                     <span className='return_cash'></span>)
                             }
-                        </Link>
+                        {/* </Link> */}
+                        </a>
                     )
                 })
             }
@@ -121,7 +135,7 @@ function ClassCourseBox(props) {
                 {props.title}
             </p>
             {props.type === 1 &&
-            <ClassCourseA data={props.data}/>
+            <ClassCourseA data={props.data} toDetail={props.toDetail} />
             }
             {props.type === 2 &&
             <ClassCourseB data={props.data}/>