reactjs 我是新的React，我有一个查询在以下代码在VS工作室在导入一个函数

vatpfxk5 于 2023-08-04 发布在 React

关注(0)|答案(1)|浏览(82)

我无法导入函数Navbar，我得到了一个空白的输出，但如果我尝试在file.js中构建函数，它会工作，所以我导入它的方式应该会有错误。有什么建议吗这是我的三个文件：navbar.js

export default function Navbar(){
    return<nav className="Navbar">
        <a href="/" className="site-title">
            Hello name of the site
        </a>
        <ul>
            <li>
                <a href="/pricing_option1">Pricing_option1</a>
                <a href="/pricing_option2">pricing_option2</a>
            </li>
        </ul>
    </nav>

}

字符串
index.html

<html>
    <head>
        <link rel="stylsheet" href="index.css">
        <script crossorigin src="https://unpkg.com/react@18/umd/react.development.js"></script>
        <script crossorigin src="https://unpkg.com/react-dom@18/umd/react-dom.development.js"></script>
        <script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>
    </head>
    <body>
        <div id="root"></div>

        <script src="file.js" type="text/babel" ></script>
    </body>
</html>

型
file.js

import Navbar from "./navbar"


ReactDOM.render(<div>
    <Navbar />
  </div>, document.getElementById("root"))

Output: blank

的字符串
如果我尝试在file.js中构建函数，它会正常工作，所以我导入它的方式应该会有错误。

reactjs

来源：https://stackoverflow.com/questions/76819468/i-am-new-to-react-i-have-a-query-in-following-code-in-vs-studio-in-importing-a

1条答案

按热度按时间

3phpmpom1#

NavBar.js:

export default function Navbar() {
  return (
    <nav className="Navbar">
      <a href="/" className="site-title">
        Hello name of the site
      </a>
      <ul>
        <li>
          <a href="/pricing_option1">Pricing_option1</a>
          <a href="/pricing_option2">pricing_option2</a>
        </li>
      </ul>
    </nav>
  );
}

字符串
index.html:

<!DOCTYPE html>
<html>
<head>
  <link rel="stylesheet" href="index.css">
  <script crossorigin src="https://unpkg.com/react@18/umd/react.development.js"></script>
  <script crossorigin src="https://unpkg.com/react-dom@18/umd/react-dom.development.js"></script>
  <script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>
</head>
<body>
  <div id="root"></div>
  <script src="file.js" type="module"></script>
</body>
</html>

型
file.js:

import Navbar from "./navbar";

ReactDOM.render(
  <div>
    <Navbar />
  </div>,
  document.getElementById("root")
);

型

赞(0）回复(0）举报 2023-08-04

我来回答

reactjs 我是新的React，我有一个查询在以下代码在VS工作室在导入一个函数

1条答案

相关问题

热门标签

最新问答