Ожидал присваивания или вызова функции и вместо этого увидел выражение: нет неиспользованного выражения

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>
}

Надеюсь, что это поможет!