viktorlarsson / vue-tiny-slider

Vanilla javascript slider for all purposes created by ganlanyuan in Vue.
MIT License
136 stars 51 forks source link

Can't get the navContainer to work #43

Closed tfdbloom closed 4 years ago

tfdbloom commented 5 years ago

I'm trying to get navContainer to work but it seems as it cant find it. I tried the option of giving it this

Here is a example on codesandbox

- navContainer: '#customize-thumbnails', 
- navContainer: document.querySelector('#customize-thumbnails'),
- navContainer: this.$refs.sliderThumbs, 

it does nothing. What could I be missing?

JGriffCS commented 4 years ago

@tfdbloom

Disclaimer: I don't own or manage this repo, just thought I'd share my findings.

I tested your codesandbox link and found two issues that I think were causing your code to not work:

  1. You need to set nav: true in your tinySliderOptions object. This is a bit confusing because that property is true by default in tiny-slider, but false by default in vue-tiny-slider.
  2. It also appears that because you are setting the tinySliderOptions in the mounted hook that the tiny-slider has already been initialized by the time your options are included.

By adding the nav: true property and removing the mounted hook and instead just initializing your properties in data I was able to get your example working which you can see in my forked codesandbox.

Hope this helps!

viktorlarsson commented 4 years ago

Closing this! Thanks for the help @JGriffCS