Link not working inside AutoCompleteItem #2086
-
I am trying to do something like this inside the AutoComplete component but my link is not working.
|
Beta Was this translation helpful? Give feedback.
Replies: 5 comments 1 reply
-
You can do something like this. import { Autocomplete, AutocompleteItem, Link } from "@nextui-org/react";
<AutoComplete
...
>
{(category) => (
<AutocompleteItem
key={category.name ?? ""}
value={category.name}
className="capitalize"
onSelectionChange={() => {
router.push('link here')
}}
>
{category.name}
</AutocompleteItem>
)}
</AutoComplete> |
Beta Was this translation helpful? Give feedback.
-
Thanks for the response! I tried this and its working now. I don't know if its the right approach though
|
Beta Was this translation helpful? Give feedback.
-
I'm facing the exact same issue but when placing the Link within a NavbarItem, seems like Links don't work well with items. I keep getting this warning aswell, console.js:213 with non-plain text contents is unsupported by type to select for accessibility. Please add a I fixed it by using OnClick() and useNavigate but its an issue which should be checked out. |
Beta Was this translation helpful? Give feedback.
-
Is there a better understanding why this happens and the fix? Basically the "fix" is pass in a prop that is just text. However when you want to make a custom view this won't work. For example I am using and in the <AutocompleteItem ... /> I have some TSX and get this same error: with non-plain text contents is unsupported by type to select for accessibility. Please add a In my case, it still pops up, see the choices, can select and even the choice has the little selected icon on it. However, it does prevent the "at-rest" view from working correctly. It will still show your placeholder value and not that value of what you just selected. So more broadly, since this use case is not about an action (like clicking a button) but rather just custom display of data, whats the workaround? Even if you take the example from the docs: https://nextui.org/docs/components/autocomplete#custom-items And strip it down, it has same issue. Even a simple test will replicate it (as content of the .
Here is a simple repo:
Maybe I should open a bug on this? |
Beta Was this translation helpful? Give feedback.
-
Beta Was this translation helpful? Give feedback.
Thanks for the response! I tried this and its working now. I don't know if its the right approach though