vue-js-toggle-button
vue-js-toggle-button copied to clipboard
Toggle button stuck on switch
Hello. After last update (1.3.3) if you have an code like in the example your button will be stuck. As i can see,it is because on (value) property there is no variable to watch and is a boolean value. Maybe someone have the same issue like me after update. I remove the (sync) property for this case and everything is working fine right now.
<toggle-button :value="false" color="#82C7EB" :sync="true" :labels="true"/>
Hey, When using :sync="true" looks like you are telling the toggle-button component to watch for changes in the object you are passing to :value prop
Which in your case is just "false" and thats why nothing really happens when you click the button
Here is an exmaple
// HTML
<toggle-button :value="data_property" color="#82C7EB" :sync="true" :labels="true" @change="changeDataProperty($event.value)" />
// VUE
changeDataProperty: function(event){
(event) ? this.data_property = true : this.data_property = false ;
}
Hey, When using :sync="true" looks like you are telling the toggle-button component to watch for changes in the object you are passing to :value prop
Which in your case is just "false" and thats why nothing really happens when you click the button
Here is an exmaple
// HTML <toggle-button :value="data_property" color="#82C7EB" :sync="true" :labels="true" @change="changeDataProperty($event.value)" /> // VUE changeDataProperty: function(event){ (event) ? this.data_property = true : this.data_property = false ; }
Hi. I mention that because in the Readme file the example is wrong, and I agree with you. But in the past I used the code wrong and it works very well. After the update 1.3.3, that bug was fixed and if you still use the example code, the one with :value="false" and :sync="true" your buttons will go crazy.