Jacobian
Jacobian

Reputation: 10802

How to set component property programmatically in Vuetify component

I have a checkbox component defined like so:

let checkbox = this.$createElement(VCheckbox, {
    props: {
        hideDetails: true
    }
});

In my code I can get a reference to this component. In other words I have access to this checkbox variable. What I want is to set property programmatically. By property I mean this part of the component:

props: {
    hideDetails: true
}

What I want is to set indeterminate to true. Something like:

checkbox.setProperty('indeterminate', true);

But I'm unable to find in documenation anything related to my problem. So, how can I implement this?

Upvotes: 4

Views: 4046

Answers (2)

John
John

Reputation: 4981

You can create a dynamic variable in your data scope :

data: function() {
  return {
    stateDetails: true
  };
}

Then use it in your props :

props: {
  hideDetails: this.stateDetails
}

And now you can change the value like that :

this.stateDetails = true / false

Upvotes: 4

Abdulla Thanseeh
Abdulla Thanseeh

Reputation: 10536

You could try

let checkbox = this.$createElement(VCheckbox, {
    ref:"refToElement",
    props: {
        hideDetails: true
    }
});
    this.$refs.refToElement.$el.setProperty('indeterminate', true);

Upvotes: 1

Related Questions