Wikiki / bulma-carousel

Display a carousel
MIT License
135 stars 98 forks source link

show() function not work #74

Open SalvatoreMazzullo opened 5 years ago

SalvatoreMazzullo commented 5 years ago

Hi, I'm trying to integrate a carousel so that it changes slides at the pressure of a particular link.

this is the javascript

const carousels = bulmaCarousel.attach('#startSite', { slidesToScroll: 1, slidesToShow: 1, pagination: false, effect: 'fade', loop: true });

I state that with the code inserted in the documentation I cannot access the desired carousel, having only one I tried to access it as if it were a simple array:

carousels[0].show(1)

but this not produce no result.

Awaiting your reply, Thank you.

janegwaww commented 4 years ago

this is the show() source code ` show(index, force = false) { // If all slides are already visible then return if (!this.state.length || this.state.length <= this.slidesToShow) { return; }

if (typeof index === 'Number') {
  this.state.next = index;
}

if (this.options.loop) {
  this._loop.apply();
}
if (this.options.infinite) {
  this._infinite.apply();
}

// If new slide is already the current one then return
if (this.state.index === this.state.next) {
  return;
}

this.emit('before:show', this.state);
this._transitioner.apply(force, this._setHeight.bind(this));
this.emit('after:show', this.state);

this.emit('show', this);

} ` and next() is working.

janegwaww commented 4 years ago

you need to set index first

lribeiro commented 4 years ago

https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Reference/Operators/typeof

key: 'show',
          value: function show(index) {
            var force = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false; // If all slides are already visible then return

            if (!this.state.length || this.state.length <= this.slidesToShow) {
              return;
            }

            if (typeof index === 'Number') {
              this.state.next = index;
            }

typeof index === 'Number' should be typeof index === 'number'

aracyla commented 4 years ago

I'm not sure if will be helpful. But to show a specific slide I did like this

let c = carousels[0]
for(let k of Object.keys(bullet_list) {
  bullet_list[k].onclick = function() {
    if(c.state.next = k) return;
    else {
      c.state.next = Number(k);
      c.show(k);
    }
  }
}
itsmeurbi commented 4 years ago

As Iribeiro says, there's an error comparing variable type. I see the method is already updated in the repo, but in npm method still using 'Number', at least in version 4.0.4.