Question

This page说：“ useState（）Hook的唯一参数是初始状态。”

我的解释是，useState接受一个参数，而该参数是初始状态。这似乎是不正确的，所以我的问题是如何设置状态变量的初始值？在下面的代码行message中，即使我将其设置为有效的字符串值，也始终是空字符串。

const [message, setMessage] = useState(props.message);

我的对话框由主机组件（props.message）传递了一个字符串。我想将该字符串分配给状态变量（message），然后在用户要关闭对话框时分配message空字符串。

Dialog.tsx

function Dialog(props: any) {
    var dummy = props.message;                                 // "foo"
    const [message, setMessage] = useState(props.message);     // set initial state     
    dummy = message;                                           // "" - expected "foo"

    const handleClose = () => setMessage('');

    return (
        <>
            <Modal show={message.length > 1} onHide={handleClose}>
                <Modal.Header closeButton>
                    <Modal.Title>Information</Modal.Title>
                </Modal.Header>
                <Modal.Body>{message}</Modal.Body>
                <Modal.Footer>
                    <Button variant="primary" onClick={handleClose}>
                        Ok
                    </Button>
                </Modal.Footer>
            </Modal>
        </>
    );
}

如何设置状态变量的初始值

0 个答案: