Error ',' expected.ts(1005) in html layout-CodePudding

This is the first time I am trying to build a real layout for my ReactJS project, but I ran into this error (Error ',' expected.ts(1005)) and can not get it off. Here is the html of the layout I intend to build:

    <div>
      {selectedInput === null ? (
        <div>
          <div>
            some html
          </div>
          <div>
            {
              array.slice(3, 100).map((doc, index) =>
                <div>
                   some html
                </div>
             } <== here the error
           </div>
        </div>
        ) : (
          <div>
            some html
          </div>
        )
       }
     </div>

I encounter the error in the last brace

EDIT: I apologize to whoever replied, but I wanted to synthesize the code and I did a horrible job. Now I have put the correct version.

CodePudding user response：

You missed the closing parenthesis) of map.

Try adding parenthesis.

Updated code:

   <div>
      {selectedInput === null ? (
         <div>
            <div>some html</div>
            <div>
               {array.slice(3, 100).map((doc, index) => (
                  <div>some html</div>
               ))}
            </div>
         </div>
      ) : (
         <div>some html</div>
      )}
   </div>

CodePudding user response：

You forgot to add closing braces, '}'.

This should work

<div>
  {selectedInput === null ? (
    <div>
      <div>
        some html
      </div>
      <div>
        {
          getOrder.slice(3, 100).map((doc, index) =>
            <div>
              some html
            </div>
        }  <== here the error
      </div>
    </div>
    }
</div>

CodePudding user response：

Too many mistakes.

Feeling like you don't understand how it works.

This code should work, but you need to understand it thoroughly.

<div>
  {selectedInput === null ? (
    <div>
      <div>some html</div>
      <div>
        {getOrder.slice(3, 100).map((item, i) => {
          return <div key={i}>some html</div>;
        })}
      </div>
    </div>
  ) : (
    <div>Another content</div>
  )}
</div>;