ReactJS:'；语言功能'；已声明，但从未读取其值

我使用react框架从一个组件（languagefunction.js）调用函数到另一个组件app.js

languagefunction.js

import React, { Component } from "react";

const languagefunction= () => <h1>hello Sir</h1>

export default languagefunction

import React from 'react';
import '../node_modules/bootstrap/dist/css/bootstrap.min.css';
import './App.css';
import { BrowserRouter as Router, Switch, Route, Link } from "react-router-dom";
import {Dropdown,DropdownButton}from 'react-bootstrap';
import Login from "./components/login.component";
import SignUp from "./components/signup.component";
import languagefunction from "./components/languagefunction";

function App() {
  return (<Router>
    <div className="App">
    <languagefunction/>
      <nav className="navbar navbar-expand-lg navbar-light fixed-top">
        <div className="container">
          <Link className="navbar-brand" to={"/sign-in"}>Tira Desk</Link>
          <div className="collapse navbar-collapse" id="navbarTogglerDemo02">
            <ul className="navbar-nav ml-auto">
              <li className="nav-item">
                <Link className="nav-link" to={"/sign-in"}>Sign in</Link>
              </li>
              <li className="nav-item">
                <Link className="nav-link" to={"/sign-up"}>Sign up</Link>
          </li>
          <li>
          <DropdownButton id="dropdown-basic-button" title="Dropdown button">
          <Dropdown.Item eventKey="english_language">English</Dropdown.Item>
          <Dropdown.Item eventKey="tamil_language">Tamil</Dropdown.Item>
          
          </DropdownButton>
            </li>
            </ul>
          </div>       
        </div>
      </nav>

      <div className="outer">
        <p>Testing</p>
        <div className="inner">
          <Switch>
            <Route exact path='/' component={Login} />
            <Route path="/sign-in" component={Login} />
            <Route path="/sign-up" component={SignUp} />
          </Switch>
        </div>
      </div>
    </div></Router>
  );
}

export default App;

import React，{Component}来自“React”；
const languagefunction=（）=>您好，先生
导出默认语言函数

App.js

import React, { Component } from "react";

const languagefunction= () => <h1>hello Sir</h1>

export default languagefunction

import React from 'react';
import '../node_modules/bootstrap/dist/css/bootstrap.min.css';
import './App.css';
import { BrowserRouter as Router, Switch, Route, Link } from "react-router-dom";
import {Dropdown,DropdownButton}from 'react-bootstrap';
import Login from "./components/login.component";
import SignUp from "./components/signup.component";
import languagefunction from "./components/languagefunction";

function App() {
  return (<Router>
    <div className="App">
    <languagefunction/>
      <nav className="navbar navbar-expand-lg navbar-light fixed-top">
        <div className="container">
          <Link className="navbar-brand" to={"/sign-in"}>Tira Desk</Link>
          <div className="collapse navbar-collapse" id="navbarTogglerDemo02">
            <ul className="navbar-nav ml-auto">
              <li className="nav-item">
                <Link className="nav-link" to={"/sign-in"}>Sign in</Link>
              </li>
              <li className="nav-item">
                <Link className="nav-link" to={"/sign-up"}>Sign up</Link>
          </li>
          <li>
          <DropdownButton id="dropdown-basic-button" title="Dropdown button">
          <Dropdown.Item eventKey="english_language">English</Dropdown.Item>
          <Dropdown.Item eventKey="tamil_language">Tamil</Dropdown.Item>
          
          </DropdownButton>
            </li>
            </ul>
          </div>       
        </div>
      </nav>

      <div className="outer">
        <p>Testing</p>
        <div className="inner">
          <Switch>
            <Route exact path='/' component={Login} />
            <Route path="/sign-in" component={Login} />
            <Route path="/sign-up" component={SignUp} />
          </Switch>
        </div>
      </div>
    </div></Router>
  );
}

export default App;

从“React”导入React；
导入“../node_modules/bootstrap/dist/css/bootstrap.min.css”；
导入“/App.css”；
从“react Router dom”导入{BrowserRouter as Router，Switch，Route，Link}；
从“react bootstrap”导入{Dropdown，DropdownButton}；
从“/components/Login.component”导入登录名；
从“/components/SignUp.component”导入注册；
从“/components/languagefunction”导入languagefunction；
函数App（）{
返回(
提拉书桌


登录


注册


英语
泰米尔人


测试

);
}
导出默认应用程序；

我面临的问题是“'languagefunction'已声明，但其值从未读取。”

我已经声明了值“import languagefunction from”。/components/languagefunction”，并在

---

我希望我做得对，请注意解释我犯的错误。

在React components中，需要以大写字母开头，请尝试以下操作：

Languagefunction.js

const Languagefunction= () => <h1>hello Sir</h1>

export default Languagefunction

const Languagefunction=（）=>您好，先生
导出默认语言函数

App.js

...
import Languagefunction from "./components/Languagefunction";

function App() {
  return (<Router>
    <div className="App">
    <Languagefunction/>
    ...

。。。
从“/components/Languagefunction”导入Languagefunction；
函数App（）{
返回(
...