首页 > 解决方案 > 在 ReactJS 不工作的单独文件夹中导入文件

问题描述

我刚刚开始一个新的 React 项目,但我无法将位于名为“Components”的单独文件夹中的特定文件导入我的 app.js 文件。

请看下面我用来导入的代码。

import React, { Component } from 'react';
import { BrowserRouter as Router, Route, NavLink } from 'react-router-dom';
import Category from './Components/Category.js';
import './App.css';

这里是刚刚开发的 Category 组件,如果它在提供解决方案方面有用吗?

const Category=()=>{
    return (
        <div>
            <div class="categories">
                <div class="category-choice">
                    <h1>CAREER</h1>
                </div>
                <div class="category-choice">
                    <h1>FINANCE</h1>
                </div>
            </div>
        </div>
        )
}

export default Category;

这是错误消息反应为我提供 在此处输入图像描述

标签: reactjs

解决方案


你需要import React在你使用的任何地方JSX。这很重要,因为所有JSX元素都被转换为React.createElement. 所以React必须始终在范围内。

import React from 'react' // add this line

const Category=()=>{
    return (
        <div>
            <div class="categories">
                <div class="category-choice">
                    <h1>CAREER</h1>
                </div>
                <div class="category-choice">
                    <h1>FINANCE</h1>
                </div>
            </div>
        </div>
        )
}

export default Category;

推荐阅读