Open ricochenft opened 1 year ago
With the following code from README.md, when selecting from the dropdown, the text from name would populate the input value. What if I want the input field to show code instead?
README.md
name
code
const colorList = [ { id: 1, name: "White", code: "#FFFFFF" }, { id: 2, name: "Red", code: "#FF0000" }, { id: 3, name: "Yellow", code: "#FF00FF" }, { id: 4, name: "Green", code: "#00FF00" }, { id: 5, name: "Blue", code: "#0000FF" }, { id: 6, name: "Black", code: "#000000" }, ] let selectedColorObject
<AutoComplete items={colorList} bind:selectedItem={selectedColorObject} labelFieldName="name" />
I can somewhat get it working by this hack-ish way:
<AutoComplete items={colorList} bind:selectedItem={selectedColorObject} labelFieldName="code" > <div slot="item" let:item> <span>{item.name}</span> </div> </AutoComplete>
But that workaround creates two new problems:
With the following code from
README.md
, when selecting from the dropdown, the text fromname
would populate the input value. What if I want the input field to showcode
instead?I can somewhat get it working by this hack-ish way:
But that workaround creates two new problems: