react-select 相关问题

用React JS构建的Select控件

Shadcn 对话框和反应选择位置问题(z-index)

我想在 shadcn 对话框中渲染反应选择下拉列表。我正在使用 document.body 的门户渲染选择,问题是一旦它打开,我就无法单击它,因为它以某种方式呈现

回答 1 投票 0

React-Select 更改时抛出“无法读取未定义的属性(读取“值”)”错误

我刚刚开始使用 React,很难将所选下拉值的值传递到后端。分享下面的代码以供参考,任何帮助将不胜感激......

回答 1 投票 0

点击外部时,react-select 不会关闭

我正在使用react-select并对其进行了一些自定义。 我尝试修改 ValueContainer 和 SelectContainer 组件,这会导致一些问题。当我点击

回答 3 投票 0

如何在反应选择中禁用自动对焦?

我有一个来自“react-select”库的选择框。我需要多选而不进行换行,如我在沙箱中所示。但每当我移除其中一个芯片或单击输入时,它就会自动对焦到最后一个...

回答 1 投票 0

React-hook-form 字段无法从状态中的对象读取

Codesandbox:https://codesandbox.io/p/sandbox/codesandboxer-example-forked-mypffg?file=%2Fexample.tsx%3A105%2C44 我有一个反应选择异步组件向 API 发出请求。我想...

回答 1 投票 0

无法从 Json 对象填充 React Select 下拉列表

我面临着从 JSON 对象填充反应选择下拉列表的问题,将下面的代码作为参考。任何帮助将不胜感激。 导入 React, { useState, useEffect } from '...

回答 1 投票 0

AsyncPaginate 中顺风环导致的样式问题

当我点击AsyncPaginate的输入栏中时,就会出现蓝色的较小输入框。一旦我评论顺风配置文件,内框就会消失。顺风类...

回答 2 投票 0

在定义反应选择的自定义样式时,我应该给出什么而不是“任何”?

在此输入图像描述 我有这样一个文件,我在其中为我的react-select选择组件定义了自定义CSS样式,并且它工作得很好,但是参数定义中的any是gi...

回答 1 投票 0

react-select中的className不适用

我刚刚开始使用react-select,当我尝试使用scss添加样式时,它们不适用,我知道有一个样式选项,您可以在其中设置选项样式和控件,但我想要一个cle.. .

回答 1 投票 0

当我有 1000 个项目时,我可以在 ReactSelect 中只显示前 N 行吗?

我使用 ReactSelect (https://react-select.com/props) 来渲染选择框。在我的具体情况下,react select 列表中呈现的每个项目都是一个带有 CSS 和 HTML 的“复杂”组件

回答 1 投票 0

react-select 选择选项后隐藏dropdownIndicator和indicatorSeparator

选择一个选项后,我需要隐藏dropdownIndicator和indicatorSeparator。 我尝试应用样式: 指示器分隔符:(基)=>({ ...根据, 显示:“无”, }),

回答 2 投票 0

React-select 删除边框

我正在尝试删除当我在反应选择的输入部分中单击或聚焦时显示的蓝色边框。 我用了 控制:(提供:任何)=>({ ...假如, 背景:&q...

回答 1 投票 0

如何覆盖输入类型文本焦点的 tailwind 配置文件

我在我的项目中使用了react-select包中的多选下拉列表。现在输入字段中的光标正在从 tailwind 基类获取 css,但我无法从我的...

回答 1 投票 0

React-select + Inertia.js

我正在使用 Inertia.js 并且我一直很喜欢它。 无论如何,我遇到了一个我似乎无法弄清楚的问题。我有一个选择输入,其中包含数据库中的选项,但其中很多都是大约的。 ...

回答 1 投票 0

React-Select 在 Sweetalert2 中不起作用

我尝试在 Sweetalert2 中使用 React-Select 组件,但是当 sweetalert 在屏幕上弹出时,它会在控制台上抛出错误。附图包含错误描述 这是我的...

回答 2 投票 0

Shadcn 使用表单内的 Select 组件不设置值

所以我使用的是Shadcn的表单组件,其中包含Input、Select和Checkbox组件。 输入和复选框组件工作正常,没有任何问题,这让我......

回答 1 投票 0

菜单打开时如何将样式应用于反应选择菜单?

比如说,我想在菜单打开时将背景颜色应用于菜单列表。我通过执行以下操作实现了所需的控制效果(输入本身): 比如说,我想在菜单打开时将背景颜色应用于菜单列表。我通过执行以下操作达到了控制(输入本身)所需的效果: <Select classNames={{ control: (state) => clsx({ [styles['control-focused']]: state.isFocused }) }} /> 我想对 menuList 组件执行相同的操作,但它的状态不会公开 isOpen 或 isFocused 属性。我该怎么做? 就 isOpen 而言,我假设 MenuList 不会呈现,除非 isOpen 为 true 我的理解是专注... MenuList 无法聚焦。输入具有焦点,或者菜单列表中的任何单个选项都具有焦点。用户无法将焦点移至 MenuList 本身。 我认为更改 menuList 样式的唯一方法是为其传递自定义组件。 我在文档中看到 MenuList 公开了道具 focusedOption 和 options 因此,您需要从自定义 MenuList 组件中的该信息导出 MenuList 焦点状态 我修改了 Custom MenuItem 组件的文档示例来定义 isFocused var: import React from 'react'; import Select, { components, MenuListProps } from 'react-select'; const menuHeaderStyle = { padding: '8px 12px', background: 'coral', color: 'white', }; const MenuList = ( props: MenuListProps ) => { // not entirely sure about the internals of the props, but something like this should work const derivedIsFocused = options.some(opt => opt.id === props.focusedOption?.id); return ( <components.MenuList {...props}> {derivedIsFocused && <div style={menuHeaderStyle}>I'm so focused</div>} {props.children} </components.MenuList> ); }; export default () => ( <Select defaultValue={colourOptions[1]} options={groupedOptions} components={{ MenuList }} /> );

回答 0 投票 0

无法在移动屏幕中单击/选择下拉选项,使用反应选择下拉菜单

我正在使用反应选择下拉菜单,它在桌面模式下选择/取消选择选项时效果很好,但是一旦我切换到响应式屏幕,选项就可见,但当我尝试单击dro时...

回答 2 投票 0

React Hook Form 控制组件。两个输入作为一个值

我正在尝试创建一个组合组件/输入字段,其中包含一个下拉列表和简单的文本字段。 我假设我需要使用 React hook 表单中的 useController 选项,但这就像 f...

回答 1 投票 0

反应选择多值的自定义单标签?

在react-select多选中选择一个选项时,默认行为是将下拉列表中的选项添加到输入中,并且所选选项从菜单中消失。 我该如何预防...

回答 1 投票 0

© www.soinside.com 2019 - 2024. All rights reserved.