node.js - 如何在表单中为 ReactJS TextField 设置 HTML 数据标签

Question

我有一些自动化功能正在寻找 HTML 数据标签（例如：“data-foobar”），并且我有一个 login.js 以便：

<div className={styles.whiteBoard}>
    <main className={styles.content}>
        <div>
           <div className={styles.spacer}></div>
                <form onSubmit={e => submit(e)}>
                    <TextField
                        className={styles.input}
                        label="Username"
                        autoFocus
                        variant="outlined"
                        margin="normal"
                        value={username}
                        onChange={e => setUsername(e.target.value)}
                    />
                </form>
            </div>
        </main>

在上面的代码中，在哪里以及如何放置一个 HTML 数据标签？

标签： node.jsreactjsautomationmaterial-ui

Answer 1

您可以使用 TextField 的inputProps对象来设置数据属性。

<TextField inputProps={{'data-foobar': 'foo bar'}}/>