时间戳

首页 > 解决方案 > 当我尝试在中间添加 jsx 或标记时，反应 js 将结束标记转换为无法访问的代码

javascript - 当我尝试在中间添加 jsx 或标记时，反应 js 将结束标记转换为无法访问的代码

问题描述

我正在学习 react-js，这是我的代码，当我尝试在给定空间“编写代码”中添加标记或 jsx 时，我的编辑器显示语法错误并禁用关闭 div 标签，并抛出无法访问的代码错误，在尽管它已经关闭，但它要求关闭表单标签的情况很少。

render() {
    const {patientsList} = this.state;

    return (
      <div style={{ height: "100%" }}>
          <NavBar />
        <form style={{ display: "flex", height: "100%", alignItems: "center" }}>
          { patientsList.length === 0 ? (
            <h1 style={{ textAlign: "center", flexGrow: "1" }}>
              No Patients Found
            </h1>
          ) : (
          {/*Write code here to create all patients details*/}
          // <table>
          //  <tr><th>id</th><th>name</th><th>email</th><th>dob</th><th>location</th><th>mobile</th></tr>
          // </table>
          )}
        </form>
      </div>
    );
 }

表格标签部分是我故意评论的，以便在此处发布该部分。我想知道我的错误，并想找出造成这种情况的主要原因以及将来如何避免此类问题。

标签： javascriptreactjs

解决方案

尝试{}从此代码中删除：

const { patientsList } = this.state;

  return (
    <div style={{ height: "100%" }}>
      <NavBar />
      <form style={{ display: "flex", height: "100%", alignItems: "center" }}>
        {patientsList.length === 0 ? (
          <h1 style={{ textAlign: "center", flexGrow: "1" }}>
            No Patients Found
          </h1>
        ) : (
          <div>Write code here!</div>
            /*Write code here to create all patients details*/
          // <table>
          //  <tr><th>id</th><th>name</th><th>email</th><th>dob</th><th>location</th><th>mobile</th></tr>
          // </table>
        )}
      </form>
    </div>
  );

推荐阅读