时间戳

首页 > 解决方案 > Reactjs 从同一目录导入

reactjs - Reactjs 从同一目录导入

问题描述

我正在使用 Reactjs 构建一个 TODO 应用程序，在我的components文件夹中，我有一个名为 TaskList 的类，其中包含用于迭代任务的代码：

import React, { Component } from 'react';
import {connect} from 'react-redux';

class TaskList extends Component {
    render(){
        return(
            <table>
                <thead>
                    <tr>
                        <th>Tasks</th>
                        <th>Actions</th>
                    </tr>
                </thead>
                <tbody>
                    {this.props.tasks.map((task,index) => <Task key={index} task={task} />)}
                </tbody>
            </table>
        );
    }
}

function MapStateToProps(state){
    return{
        tasks:state.tasks
    }
}

export default connect (MapStateToProps)(TaskList);

同样在 components 文件夹中，我有一个名为 Task 的类，用于我的 TaskList 类：

任务：

import React, {Component} from 'react';
import {connect} from 'react-redux';
import {bindActionCreators} from 'redux';
import {DeleteTask} from '../../redux/actions';

class Task extends Component {
    render(){
        return(
            <tr>
                <td>
                    {this.props.task}
                </td>
                <td>
                    <button onClick = {() => this.props.DeleteTask(this.props.id)}>Delete</button>
                </td>
            </tr>

        );
    }
}

function MapDispatchToProps(dispatch){
    return bindActionCreators({DeleteTask},dispatch);
}

export default connect (() => {return {};},MapDispatchToProps)(Task);

我的问题是我有错误任务未定义，因为我没有将任务导入任务列表。在 TaskList 我已经尝试过：

import Task from './components/task';
import Task from 'task'; //as it's on the same directory
import Task from './task';

没有任何工作。对此有什么想法吗？

标签： reactjsecmascript-6frontend

解决方案

我自己解决了错误，导入应该是

 Import Task from '../task'

推荐阅读