程序员经验分享-hwhale

在 Material UI 中，我们何时使用 Input 与 TextField 来构建表单？

2024-01-01

也许这只是一个基本问题，但到目前为止还没有找到任何合理的解释。我是 React 的初学者，最近正在使用 Material UI。我不太清楚何时使用输入和何时使用输入Textfield用于构建表单。

看文档感觉是TextField是什么的超集Input可以做，但不确定。 Material UI 网站使用示例TextField and Input两者都有，但没有说明其中一种相对于另一种的优势以及任何用例。

请建议。


对于大多数用例，您应该使用TextField而不是它委托给的较低级别的组件（例如Input).

文档的相关部分是here https://mui.com/components/text-fields/#components.

特别是这一行：

TextField 由较小的组件（ FormControl、Input、FilledInput、InputLabel、OutlinedInput 和 FormHelperText ）组成，您可以直接利用这些组件来显着自定义表单输入。

使用这些较低级别组件的主要原因是，如果您需要以某种不支持的方式自定义表单输入TextField.

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)

ReactJS

input

materialui

TextField

在 Material UI 中，我们何时使用 Input 与 TextField 来构建表单？ 的相关文章

随机推荐

  • MOQ 错误 预期对模拟调用一次，但实际调用次数为 0 次

    我是最小起订量新手 我已阅读快速入门here https github com Moq moq4 wiki Quickstart 我使用的是最小起订量 v4 2 1402 2112 我正在尝试创建一个单元测试来更新人员对象 这UpdateP

  • 如何为Alamofire请求功能编写单元测试？

    我有一个项目 我正在发送 GET 请求以从服务器获取数据 为此我使用 Alamofire 和 SwiftyJSON 例如 我有文件 链接 请求 和我的视图控制器 链接 swift var getAllData String return h

  • 集合上最小、最大的时间复杂度

    min max 的时间复杂度为 O N 因为它们必须循环给定的列表 字符串并检查每个索引以找到最小值 最大值 但我想知道如果在集合上使用 min max 的时间复杂度是多少 例如 s 1 2 3 4 s is a set 使用最小 最大我们

  • 在Python（最好是py3k）上使用sscanf？

    我见过这个问题 https stackoverflow com q 2175080 309483 但我遇到了问题顶级解决方案 https hkn eecs berkeley edu dyoo python scanf 例如 gt gt gt

  • 如何在 Laravel 中将变量传递给服务提供者？

    我想在侧边栏中生成一个动态菜单并与 Laravel 5 1 中的所有视图共享 like Marks Module Langosh Topic Content 1 Content 2 Nitzsche Topic Content 3 Rolf

  • 我怎样才能制作一个水平选择器？

    我想为我的应用程序制作一个水平选择器 但我对这一切还很陌生 有人可以提供一个易于遵循的指南来指导我如何做到这一点吗 最好的方法是伪造你自己的使用UIScrollView启用分页 实际上相当简单 将滚动视图与您自己的自定义图形视图重叠

  • 用最顶层的括号分割字符串

    我有一个如下所示的字符串 1 2 3 我想对其进行正则表达式以获得以下数组 1 2 3 另一个例子 asd dfg asd bdfg asdf asd gt asd dfg asd bdfg asdf asd 我试图搜索如何执行这样的正则表

  • Javascript Uncaught Reference 错误 函数未定义

    检查小提琴 http jsfiddle net vSHQD 查看故障发生情况 当我将数据 即使我将其留空 添加到文本框并尝试单击 添加 时 它不会执行任何操作 打开 Chrome 和 Firefox 控制台都会给我同样的错误 它说 chan

  • 如何在android中设置适合所有屏幕的壁纸，无需拉伸、缩放和裁剪

    注意 请不要将其标记为重复 因为几年前就曾提出过同样的问题 这在当时可能有效 但现在不起作用 使用下面的代码 我的壁纸要么拉伸到屏幕 2 和 3 要么根据设备在屏幕底部裁剪 以下代码适用于三星设备 但不适用于其他制造商的设备 我还尝试使用以

  • symfony2 orm 学说中与额外字段的多对多关系

    嗨 我有与这里相同的问题 与额外字段的多对多自关系 https stackoverflow com questions 9134856 many to many self relation with extra fields但我找不到答案

  • 如何在 Fragment 中使用 SharedPreferences 保存数据

    我在永久保存数据时遇到问题 它应该很简单 我将数据发送到另一个片段并且它工作得很好 但是 我不知道如何保存数据 我尝试了一些事情 但我想知道你是否可以帮助我 在我的代码中 我通过按下按钮将数据发送到另一个片段 这是代码 包 com exam

  • 如何删除 Flex 4 TextArea 组件的边框（spark 主题光环）

    使用 Flex 3 SDK 您只需将 borderThickness 样式设置为 0 或将 borderStyle 设置为 none 对于 Flex 4 SDK 和 Spark 主题 这没有效果 尝试类似的方法 borderVisible

  • 删除目录中的内容时出错 - Domain=NSCocoaErrorDomain Code=4 | Domain=NSPOSIXErrorDomain Code=2“没有这样的文件或目录”

    运行下面的代码时如何修复以下错误 我已经在 SO 中搜索过 但找不到 Swift 3 的任何内容 Delete all files in given directory let path NSSearchPathForDirectories

  • 在 Sitefinity API 中为文件系统上已存在的文档创建文件

    我正在使用 Sitefinity 作为 Visual Studio 2012 中的解决方案 我使用的是 64 位计算机 我刚刚安装了 Windows Identity Manager 因为在此之前我收到了另一个错误 这与未安装该错误有关 现

  • 每页都有 Jekyll 分页

    据我们所知 Jekyll 默认分页仅支持 index html 我想创建 blog html 包含分页 有什么解决办法吗 如果您创建一个名为 blog并放置一个index html文件里面 然后你可以添加一个设置 config yml说的是

  • PHPUnit - 当 dataProvider 返回空数组时不要失败

    我有一个 PHPUnit 测试 它使用 dataProvider 数据提供者检查文件系统中的某些文件 但是 我在不同的环境中使用此测试 这意味着文件可能不存在 这意味着 dataProvider 没有找到任何内容 并且测试未执行 这会导致测

  • 将多维 PHP 数组传递给 javascript

    我有一个数组 my array 看起来像 array 2 25 gt int 10 30 gt int 8 我想将它分配给一个 javascript 数组 但我很难做到这一点 有什么建议么 编辑 起初 我以为我可以像字符串一样分配它 但这不

  • 高效的最长公共子序列算法库？

    我正在寻找一种 空间 高效的 LCS 算法实现 以便在 C 程序中使用 输入是两个随机访问整数序列 我目前正在使用关于 LCS 的维基百科页面上的动态编程方法 然而 这在内存和时间上有 O mn 的行为 并且对于较大的输入来说会因为内存不足

  • ZendFramework 2 中的控制器特定布局

    我的 zendframework 2 应用程序中有一个模块 其中包含两个控制器 我想为控制器的其中一个操作设置不同的布局 有没有办法在模块配置文件中设置它 P s 我只是尝试使用以下命令将其设置在控制器的 CONSTRUCT 方法内 但它不

  • 在 Material UI 中，我们何时使用 Input 与 TextField 来构建表单？

    也许这只是一个基本问题 但到目前为止还没有找到任何合理的解释 我是 React 的初学者 最近正在使用 Material UI 我不太清楚何时使用输入和何时使用输入Textfield用于构建表单 看文档感觉是TextField是什么的超集I

热门标签