为什么我的 RadioButton 不起作用并且我得到了 Unterminated JSX 内容？

Question

我看到了那个教程：radiobutton

所以我决定使用以下代码与 React 和 Tailwind 一起检查它是否有效：

import React from "react";
import "./styles.css";
import "./styles/tailwind-pre-build.css";
import Navbar from "./components/Navbar";
import LivePortal from "./components/LivePortal";
import WorkContainer from "./components/WorkContainer";
import HomePage from "./components/Homepage";
import { BrowserRouter as Router, Switch, Route } from "react-router-dom";

const App = () => {
  return (
    <>
    <input className="sr-only peer" type="radio" value="yes" name="answer" id="answer_yes">

                              <label
                                  className="flex p-5 bg-white border border-gray-300 rounded-lg cursor-pointer focus:outline-none hover:bg-gray-50 peer-checked:ring-green-500 peer-checked:ring-2 peer-checked:border-transparent"
                                  htmlFor="answer_yes">Yes</label>

                              <div className="absolute hidden w-5 h-5 peer-checked:block top-5 right-3">
                                  
                              </div>
                            
    </>

  );
}

export default App;

但是我出现了以下错误：/src/App.js: Unterminated JSX contents (23:7)

你可以在这里看到完整的项目：My project

你能帮帮我吗？我不明白为什么它不起作用...非常感谢！

Answer 1

您需要在输入标签上放置自闭标签。现在它只是一个 > 但应该是 />

为什么我的 RadioButton 不起作用并且我得到了 Unterminated JSX 内容？

Why my RadioButton does not work and I got Unterminated JSX contents?

reactjs

tailwind-css