无法在reactJS中使用空 Package 〈>

m4pnthwp 于 2023-02-04 发布在 React

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

按照aboutfunction中的建议，我尝试使用空 Package 器〈〉...〈/〉 Package 器，但错误被作为〈〉的意外标记抛出..请帮助解决错误

const rootx = ReactDOM.createRoot(document.getElementById('Abt'));
const element5 = <AboutPage />; 
rootx.render(element5); 

function AboutPage() {
  return (
    <>
      <h1>About</h1>
      <p>Hello there.<br />How do you do?</p>
    </>
  );
}

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <title>Add React in One Minute</title>
  </head>
  <body>

    <h2>Add React in One Minute</h2>
    
    <!-- We will put our React component inside this div. -->

<link rel="icon" type="./x-icon" href="./favicon.ico">

<div id="Abt"></div>
    <!-- Load React. -->
    <!-- Note: when deploying, replace "development.js" with "production.min.js". -->
    <script src="https://unpkg.com/react@18/umd/react.development.js" crossorigin></script>
    <script src="https://unpkg.com/react-dom@18/umd/react-dom.development.js" crossorigin></script>
  <!-- Load your React component. -->
 <script type="module" src="lik.js"></script>
  </body>
</html>

reactjs

来源：https://stackoverflow.com/questions/75307755/not-being-able-to-use-empty-wrapper-in-reactjs

1条答案

按热度按时间

jpfvwuh41#

const root4 = ReactDOM.createRoot(document.getElementById('Abt'));
const element4 = <AboutPage />; 
root4.render(element4); 

function AboutPage() {
  return (
    <>
      <h1>About</h1>
      <p>Hello there.<br />How do you do?</p>
    </>
  );
}

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <title>Test Page-React</title>
  </head>
  <body>

    <h2>Add React in One Minute</h2>
    
    <!-- We will put our React component inside this div. -->
    <div id="root"></div>
    <div id="tworoot"></div>
<link rel="icon" type="./x-icon" href="./favicon.ico">

<div id="Abt"></div>
    <!-- Load  React. -->
    <!-- Note: when deploying, replace "development.js" with "production.min.js". -->
    <script src="https://unpkg.com/react@18/umd/react.development.js" crossorigin></script>
    <script src="https://unpkg.com/react-dom@18/umd/react-dom.development.js" crossorigin></script>
  <!-- Load your React component. -->
 <script type="module" src="lik.js"></script>

  
  </body>
</html>

新版本的巴别塔可以通过巴别塔版本更新的第2步进行更新
npm安装@巴伯尔/cli@7巴伯尔-预设-React-应用程序@10
并更新了新的JSX预处理器命令：
npx babel--监视源--输出目录--预设babel-预设-React-应用程序/产品
这将允许空〈〉..〈/〉编译和呈现（随附屏幕截图）

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

我来回答

无法在reactJS中使用空 Package 〈>

1条答案

相关问题

热门标签

最新问答