在Material-UI TextField上禁用浏览器自动完成功能

文章/答案/技术大牛

发布

1回答

reactjs、autocomplete、material-ui

我有一个持续的问题，当用户点击输入时，浏览器自动完成弹出窗口阻止国家/地区选项的视图。我已经尽了最大的努力将自动补全功能关闭，但是没有任何效果。有人能给出一个可行的解决方法吗？{option.label} )} <TextField

浏览 8提问于2021-05-20得票数 0

3回答

如何将autocomplete=设置为vaadin中的“off”

vaadin

是否可以将HTML5属性autocomplete="off"设置在Vaadin 7中的TextField上？我已经搜索过了，但没有找到在文本字段上设置属性的方法，或者只是提示浏览器以其他方式在vaadin中禁用输入字段的本机自动完成功能。

浏览 1提问于2014-11-03得票数 10

回答已采纳

14回答

material-ui TextField禁用浏览器autoComplete

html、forms、input、autocomplete、material-ui

我使用material ui v0.20.0，并且我必须禁止保存具有TextField的用户的密码。我给TextField autocomplete=‘to’添加了一些道具，因为并不是所有的浏览器都能理解autocomplete='off‘。似乎Chrome 63的最新版本不接受它。当chrome要求保存密码时，我保存了密码，然后我想要编辑输入，我仍然有这个： name='userName' floatingLabelTex

浏览 1提问于2018-01-17得票数 43

2回答

Material UI Autocomplete -禁用键盘输入(在移动设备上)

javascript、reactjs、material-ui

它在台式机上效果很好，但在移动设备上，我想禁用键盘输入，只允许触摸选择。换句话说，我不希望出现智能手机键盘。我在文档中找不到任何参数：https://material-ui.com/api/autocomplete/#props 我试图禁用TextField，但我仍然可以输入文本-似乎禁用的参数没有添加到页面源代码的输入字段中renderInput={(params) => <TextField {...pa

浏览 63提问于2020-07-09得票数 3

回答已采纳

1回答

Material ui用autocomplete替换TextField功能

reactjs、autocomplete、material-ui、textfield

有一个国家/地区列表，我将其映射到该列表上，并在TextField组件中显示选项，以便用户可以选择。TextField很棒，但它缺少搜索功能，所以我决定切换到自动完成。但是，当涉及到受控自动完成组件时，会有一些问题。我将附加的代码与TextField，并在此之后与自动完成。import React, { useState } from "react"; import <

浏览 0提问于2020-12-08得票数 0

2回答

Material-UI自动完成禁用选项出现在数组中

reactjs、material-ui

我尝试按照他们的使用<Autocomplete /> Material-UI组件。他们的示例显示了如何使用getOptionDisabled prop函数禁用自动完成功能，如下所示：假设我有一个动态生成的timeSlots数组，我想禁用它，timeSlotsArr，我如何使用这个属性来排除timeS

浏览 20提问于2019-11-08得票数 1

5回答

删除浏览器自动填充功能

html、css、reactjs

我需要删除浏览器的自动填充/建议功能。在Textfield组件中使用autocomplete="off“禁用此自动填充。一旦我这样做了，这将带来浏览器的自动填充功能在Edge中，如果我关闭了"Settings/Profile/Personal info“中的"Save and fill the personal有没有

浏览 22提问于2021-09-29得票数 0

1回答

Vaadin表单和粘合剂:从预填充列表中选择值时的奇怪行为

vaadin

我有一种奇怪的/错误行为，在这种情况下，我不能说bug是用Vaadin的活页夹还是浏览器(Brave/Chrome)，或者这里是怎么回事：表单提供了几个输入字段(一些数值、一些电子邮件地址和一些文本字段当我点击其中一个电子邮件字段时，我的浏览器打开一个选择框，并提供两个保存的电子邮件地址作为“自动填充”值。如果我选择其中之一(或者实际上，当我用鼠标悬停在其中一个“自动填充”选项上时)，该表单的所有字段都会被该值填充，也就是说，不只是当前包含游标的电子邮件字段，而是所

浏览 13提问于2022-09-16得票数 0

1回答

如果输入在ReactJS中已具有焦点，则阻止设置焦点onClick

reactjs、material-ui

ReactJS/Material-UI新手问题。我有一个由useEffect和钩子组成的功能组件。为了简单起见，我创建了下面的代码示例。如果您单击自动完成容器边界(由红色边框表示)内的任何位置，则会将焦点设置在输入字段上。但是，如果您再次单击边界，您将注意到它将再次设置焦点。如果在没有使用document.activeElement和避免反模式的情况下还没有在输入字段上设置焦点，我会尝试只在输入字段上设置焦

浏览 32提问于2021-07-01得票数 0

回答已采纳

2回答

在Material-ui Autocomplete组件上设置文本颜色、轮廓和填充

reactjs、material-ui

我们希望更改Material-ui Autocomplete组件上的文本颜色、轮廓和填充。width: 400, paddingLeft: 20 }} <TextFieldclassName: classes.inputColor但是，以这种方式应用样式会影响AutoComplete功能(它将失去自动<em

浏览 2提问于2019-11-22得票数 14

回答已采纳

1回答

React js material ui自动完成芯片，里面有一个按钮

javascript、reactjs、autocomplete、material-ui

第二个输入域始终是自动完成的，但不起作用，在其中的TextField中插入了一个按钮。我想要做的是把它们放在一起，也就是像第一种情况一样有一个自动补全功能，但里面有一个按钮，以提供现代用户的用户体验。import React from "react"; import { Butt

浏览 2提问于2020-03-06得票数 1

5回答

如何更改禁用文本框的颜色？

javascript、reactjs、material-ui、jsx

我想更改文本字段中显示的禁用文本的颜色--它当前太亮了：我希望这个颜色比这个更深一些。我尝试了以下几点：import TextField from '@material-ui/core/TextField'; disabledInput: { color:&#x

浏览 0提问于2020-06-09得票数 4

回答已采纳

1回答

如何在react-hook-from中使用material-ui自动完成功能

reactjs、react-hooks、react-hook-form

我在我的应用程序中使用了react-hook-form，并在react-hook-form中使用了autocomplete。我的自动完成有像1988,1987,1986这样的下拉值，我想我不需要为这个自动完成使用onchange事件，当我从下拉列表中选择1988时，这个值通过react-hook-form传递，而不使用onchange我知道我们可以使用onChange事件并将选定的下拉值设置为状态，但是我并不打算对表单变量进行任何状态管理，因为react-hook-form内部使用状态管理，并在提交表单时

浏览 28提问于2021-07-31得票数 1

回答已采纳

1回答

自动完成值不在状态上设置，也可能仅设置在自动完成上。

reactjs、material-ui

自动完成值不在状态上设置，也可能仅设置在自动完成上。当我选择了一个值后，当我选择一个值，当我点击一个空白点或其他任何地方，我所选择的值是消失的。我没有检查状态值，所以可能值是在状态上设置的，而不是在自动完成上。CodeSandbox : import { Co

浏览 1提问于2021-06-11得票数 1

回答已采纳

2回答

反应材料自动完成部件的不正确下拉定位-UI

reactjs、autocomplete、material-ui

在展开Material自动完成组件时，下拉列表将按预期打开。然而，一旦它被打开，我滚动它移动，而不是停留在以下的自动完成框。我发现，对于使用的material版本，这种行为应该是固定的。我还在沙箱上测试了一个简单的新项目，它在沙箱上运行得很好。 value={filter.vin} rende

浏览 5提问于2020-03-31得票数 1

回答已采纳

2回答

如何防止HTML表单上的浏览器自动填充功能？

html、forms

我不是说字段自动完成(当您单击表单的textbox并得到一个下拉列表，其中包含以前输入的值列表)，而是使用浏览器先前保存的个人数据填充表单的浏览器自动填充功能(第一、最后、地址、组织、电话、电子邮件等)在chrome中，自动填充可以在以下位置进行管理:chrome://设置/自动填充人们正在交替使用“自动完成”和“自动填充”这两个术

浏览 4提问于2021-02-25得票数 5

3回答

如何在不使用主题的情况下自定义Material-UI的下划线样式？

reactjs、material-ui

当variant="outlined"和我在InputProps中使用notchedOutline时，我成功地使用了大纲自定义样式。否则，即使在underline作为InputProps中的键/类的情况下，它也不能工作。我甚至尝试过root。export default ({ boxType, classes, value, onChange, style }) => ( variant={boxType

浏览 4提问于2019-05-07得票数 1

回答已采纳

1回答

如何从受控的自动完成系统中移除芯片？

reactjs、material-ui

我目前正在使用Material "Autocomplete“组件来具有多选择功能。"@material-ui/core/TextField";const top100Films = []; 我试图将它作为受控组件使

浏览 1提问于2020-07-10得票数 0

1回答

物料界面-是否自动完成默认边距？

html、css、reactjs、autocomplete、material-ui

我是第一次接触material-ui，对于自动补全的边距，我看不到任何东西。我有一个结合了自动完成和TextInput的表单。在这里，我不得不在TextInput上添加页边距以使它们对齐，但我仍然在自动完成上留下我想要的marginLeft。显然，我可以为它添加样式，但这会导致{xs}大小在缩放时崩溃。正如你在图片中看到的，自动补全的边距与TextInput相去甚远： ? 任何

浏览 20提问于2021-09-17得票数 0

回答已采纳

1回答

react__WEBPACK_IMPORTED_MODULE_0___default.a.useContext不是函数--在物料UI中使用自动完成时

javascript、reactjs、autocomplete、material-ui、react-hooks

当我尝试使用Material UI创建自动完成标签时，收到以下错误： ? 自动完成的代码如下所示： import React, {useState, useEffect, useContext} from 'react';import {withStyles} from '@material-ui/core/styles'; import

浏览 36提问于2020-03-25得票数 1

点击加载更多