Changing :options during run-time, are not applied with update()

ivan-stojanov commented 5 years ago

I have created a codesanbox, with the full code of the described particular issue below: https://codesandbox.io/s/vqm9rn4ry7.

What I'm expecting here is: to toggle the wheelPropagation with a click on the button, and scrolling in the provided "container" where the perfect-scrollbar is applied, to "propagate / not propagate" the scrolling on the main screen. depending of the value for variable: wheelPropagation.

Code is in the components/ScrollbarTest.vue and from there you can see that in the <perfect-scrollbar> component I'm dynamically passing the :options:

    <perfect-scrollbar
      :options="{ wheelPropagation: wheelPropagation }"
      ref="scroll"
      class="container"
    >

where the second wheelPropagation is a variable in my component:

  data() {
    return {
      wheelPropagation: false,
      ...
    };
  },

changing this value with a click on a button - inside the method:

    toggleWheelPropagation() {
      let self = this;
      //setTimeout(() => {
      //self.$nextTick(() => {
        self.wheelPropagation = !self.wheelPropagation;
        self.refs["scroll"].update();
      //});
      //}, 0);
    }

Is actually not applying the new values in the passed :options property. I also tried using the setTimeout() and $nextTick() methods, but also was not working.

So I'm wondering: am I doing something wrong here, or maybe this is actually not supported?

vibesudi commented 5 years ago

"self.$refs"

o4umevshiy commented 5 years ago

However dont work: https://codesandbox.io/s/vue-template-bf8qo

mercs600 commented 5 years ago

I suggest to watch on options props then when props were changed we should update perfect scrollbar instance. I'm not sure if update method (from PS) is applying changes options ? Maybe we should destroy and create new. What do you think ?

o4umevshiy commented 5 years ago

I suggest to watch on options props then when props were changed we should update perfect scrollbar instance. I'm not sure if update method (from PS) is applying changes options ? Maybe we should destroy and create new. What do you think ?

In this case, our block will jump

mercs600 commented 4 years ago

@ivan0071 @o4umevshiy check my PR -> https://github.com/mercs600/vue2-perfect-scrollbar/pull/26

mercs600 / vue2-perfect-scrollbar

Changing :options during run-time, are not applied with update() #9