預期分配或 function 調用，而是看到一個表達式：沒有未使用的表達式

Question

import Alert from '@material-ui/lab/Alert';
export default function MyComponent(props) {
let [disabled] = useState(false);
const calculateTotal = event => {
        if (!disabled) {
            disabled = true;
            calTotal().then(validateResult => {
                disabled = false;
            });
        } }


       { return(
        disabled && (
            <Alert severity="warning"> Previous request is in progress!!! </Alert>
        )
    )}

    };

使用返回功能有效，但我一起丟失了警告消息

Answer 1

您需要將 JSX 傳遞給渲染引擎。 我整理了一個 例子：

import React from "react";
import ReactDOM from "react-dom";

import App from "./App";

const rootElement = document.getElementById("root");

// If I tried to execute this line it would fail (see the Problems tab)
<App />;

// But this works (because you need an engine to render JSX)
ReactDOM.render(<App />, rootElement);

如果在組件中渲染，則需要返回 JSX：

const Test = () => (
  <Alert>My Alert</Alert>
)

// or more verbosely

const Test2 = () => {
  return <Alert>My Alert</Alert>
}

希望有幫助！