Subscribe on changes!

False boolean props to component in template (similar to: <MyComponent is-some-bool />)

avatar
Oct 13th 2022

What problem does this feature solve?

Currently, there is a quick way to add a boolean true prop to a component (which is AWESOME 🎉 ).

<MyComponent is-some-bool />

But no way to quickly add a false boolean prop.

Benefit would be quicker dev time and better dev experience.

<MyComponent :is-some-bool="false" />

Writing out this v-bind every time is a bit tedious for a bool on false when we have such a beautiful way to write true bools. Moreover, we all write this almost every day.

What does the proposed API look like?

My suggestion is to have something like this:

<MyComponent !is-some-bool />

I don't know if this exact syntax is feasible under the hood, but if it is, I think it would be great. Otherwise, totally open to suggestions.

Thanks for considering.

P.S. Happy to jump on this with a PR if people like the idea.

avatar
Oct 13th 2022

My suggestion is that you can set the default value of prosp in MyComponent to false so that you don't need to pass is-some-bool= "false".

avatar
Oct 13th 2022

My suggestion is that you can set the default value of prosp in MyComponent to false so that you don't need to pass is-some-bool= "false".

Good point.

What if the default in the component should be true though?

avatar
Oct 13th 2022

Change it to something that should be false by default, ex. if you have prop hidden that is true by default then you can change it to visible that would be false by default

avatar
Oct 13th 2022

I don't think we will add another Template API for this as the mentioned approaches should be enough to cover this in the usual scenarios.

avatar
Oct 13th 2022

I don't think we will add another Template API for this as the mentioned approaches should be enough to cover this in the usual scenarios.

Alright, I'll close it

avatar
Oct 13th 2022

P.S. real world usecase using vue3datepicker library.

<date-picker
    :clearable="false"
    :Is24="false"
    :month-change-on-scroll="false"
/>

These are all true by default and the suggested refactors don't really make sense for this particular use case.

Eg: clearable, what else would it be called to make it default false?

Anyway, just thought I'd throw it out there in case there is any chance of reconsidering 😜