如何在我的 JS 文件中发表评论？使用 HTML 语法错误和 JS 错误？ [复制]

Posted 2023-02-22

【中文标题】如何在我的 JS 文件中发表评论？使用 HTML 语法错误和 JS 错误？ [复制]

【英文标题】：How can I comment within my JS file? Using HTML syntax errors and JS erros? [duplicate]

【发布时间】：2020-12-13 15:55:01

【问题描述】：

如果我输入 // 告诉 JS 编译器我想发表评论，它会呈现它但是如果我放置 html 语法它会出错并说 Parsing

如果我使用 HTML 语法，当我使用 JS 时它会显示编译失败，它会显示文本

这是我的 Join.js 文件

import React, useState from 'react';
import Link from "react-router-dom";//Link to our /chat path

/*importing my styles*/
import './Join.css';


export default function SignIn() 
    //I must always declare hooks within function based
    //component and no where else
    //first element in index is the nameof the variable and the second is the setter func
    //name is a state and setName is a function that is the setter of the state
    //I am passing the name Stage an empty string 
    const [name, setName] = useState('');

    //State #2
    const [room, setRoom] = useState('');


    return (
        <div className="joinOuterContainer">
            <div className="joinInnerContainer">
                <h1 className="heading">Join</h1>
                // OnChange Handler: logic of the component happens. When the user types sth in the textbox
                //An Event will be raised
            
                return(
                <div>
                    <input placeholder="Name" className="joinInput" type="text" onChange=(event) => setName(event.target.value)/>
                </div>
                <div>
                    <input placeholder="Room" className="joinInput mt-20" type="text" onChange=(event) => setRoom(event.target.value)/>
                </div>
                
                /*Link will lead us to chat but we have to pass in parameters thanks to the question mark
                Prevent the user from logging in if the input validatio usrename and pass are wrong since this will break out app*/
                
                /*Raise the event only if the condition is met*/
                <Link onClick=e => (!name || !room) ? e.preventDefault() : null to=`/chat?name=$name&room=$room`>
                    <button className="button mt-20" type="submit">Sign In 968 6342 56837</button>
                    
                </Link>
            </div>
        </div>
    );

【问题讨论】：

我不知道 React，但我认为你不能只在 javascript 中放置 HTML 代码。您需要将其引用为字符串或使用模板文字。

@ScottMarcus 这不是 HTML，它是 JSX，它在 React 项目中是有效的，只要它被正确配置为转译为 vanilla JS。虽然 OP 的 JSX 代码中的注释语法不正确。

【参考方案1】：

您可以使用以下方法在 jsx 中添加 cmets：

例如

export default function SignIn() 
    return <div>
       
          // woohoo! 
       
       /* oooooh ya */
    </div>