Search Select

Display Order

The Display Order feature is an essential aspect of this package. It eliminates the need for manual modification or manipulation of arrays to achieve your desired display outcome. Instead, you can directly select the text you want to display from your array, allowing for a more straightforward and efficient way to manage content presentation.

firstName lastName | employeeId

firstName - lastName employeeId

It is flexible and easy to configure.

Demonstration of how Primary Key works

Move this and see the effect in the input

firstName

lastName

employeeId

You can choose the kind of order you want and it will display exactly the way you want it.

Code Snippet

 <SearchSelect
    :data='pseudoEmployeeData'
    placeholderName='Employee'
    displayKey='firstName lastName | employeeId'
    v-model='value'
    primaryKey='employeeId'
  />

Note: The keys specified in the displayKey prop should exist in the array you are passing to the component.