[英]Change the select tag from AntDesign
I have the next component in my application:我的应用程序中有下一个组件:
const Demo = () => {
const [value, setValue] = useState(null);
const clear = () => setValue(null);
return (
<div>
<Select
mode={"multiple"}
value={value}
onChange={setValue}
allowClear={false}
placeholder="PERMANENT TEXT" //i want to make vissibile this text permanent even i select an item from select tag
style={{ width: "200px" }}
showSearch={false}
// defaultActiveFirstOption={false}
>
<Option value="jack">Jack</Option>
<Option value="lucy">Lucy</Option>
<Option value="tom">Tom</Option>
</Select>
<button onClick={clear}>reset</button>
</div>
);
};
const Demo = () => { const [value, setValue] = useState(null); const clear = () => setValue(null); return ( <div> <Select mode={"multiple"} value={value} onChange={setValue} allowClear={false} placeholder="PERMANENT TEXT" //i want to make vissibile this text permanent even i select an item from select tag style={{ width: "200px" }} showSearch={false} // defaultActiveFirstOption={false} > <Option value="jack">Jack</Option> <Option value="lucy">Lucy</Option> <Option value="tom">Tom</Option> </Select> <button onClick={clear}>reset</button> </div> ); };
I try to achieve next:我尝试实现下一个:
1. I try to make the placeholder visible permanent when i open the application, but now a tag still as the first item, but i want to hide it. 1.我尝试在打开应用程序时使占位符永久可见,但现在标签仍然作为第一项,但我想隐藏它。
And to show every time:并且每次都显示:
I tried defaultActiveFirstOption={false}
but it does not happens.我试过
defaultActiveFirstOption={false}
但它没有发生。
PERMANENT TEXT
like in the image before this.PERMANENT TEXT
。I think the problem is useState(null);
我认为问题是
useState(null);
. . The default state should be undefined.
默认的 state 应该是未定义的。 You just need to change it to
useState();
您只需将其更改为
useState();
https://codesandbox.io/s/select-with-search-field-ant-design-demo-mew2p https://codesandbox.io/s/select-with-search-field-ant-design-demo-mew2p
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.