Prepending into list of selection (suggestion on possible workaround)

[tkd-itsuki]

I am trying to create a dynamic date picker where I add at the start or end of the array depending whether the user is selecting the past dates or future dates. Using list.push works well with animation because the currentIndex isn't change but putting new values in front of the array using list.unshift results into currentIndex being changed thus resulting in the following animation. any suggestion/workaround on this?

https://user-images.githubusercontent.com/60599699/121943700-cf2ed300-cd8c-11eb-94ab-18cdff8d6891.mov

[hiyali]

@itsukiuehara I see, seems like you need to set up an proper currentIndex when you update the list option, for example:

// push
list.push([something])
currentIndex = list.length - 1

// for unshift
list.unshift([something])
currentIndex = 0

// after all
pickerInst.setGroupData({
  ...
  list,
  currentIndex,
  ...
})

[tkd-itsuki]

@hiyali Thanks for the fast response. If I apply the above code, the picker will always select the option above the one I selected.

[hiyali]

@itsukiuehara No worries.

I don't know what is the business scenario is, but I guess you could set the all years first, i.e.: [1900, 1901, ... ,2021] and set the currentIndex to 0 at one time to solve the problem if you can't handle the effect that you wanted to achieve

You need to know, VueSmoothPicker is not designed as you supposed it to be

[adrianostas]

Is it possible to adjust the number of displayed items (increase)? Thank you!

[hiyali]

@adrianostas this version, no.