New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Can I use the bool attribute with the custom tag? (like "disabled") #1618

Closed
hajimegane opened this Issue Feb 22, 2016 · 5 comments

Comments

Projects
None yet
3 participants
@hajimegane

hajimegane commented Feb 22, 2016

I noticed that bool attributes cannot work in the custom tag's "opts".

<my-app>
  <button onclick="{toggle}">Click</button>
  <my-tag aaa="{this.flg}" disabled="{this.flg}"></my-tag>

  this.flg = false
  toggle() {this.flg = !this.flg}
</my-app>

<my-tag>
  <div>aaa: {opts.aaa}</div>
  <div>disabled: {opts.disabled}</div>
</my-tag>

1 click: aaa=true, disabled=null
2 click: aaa=null, disabled=disabled
3 click: aaa=true, disabled=disabled

But I expected below.
1 click: aaa=true, disabled=disabled
2 click: aaa=null, disabled=null
3 click: aaa=true, disabled=disabled

Or below.
1 click: aaa=true, disabled=true
2 click: aaa=null, disabled=null
3 click: aaa=true, disabled=true

Should I not use bool attributes with custom tags? (Or Should I use "opts.__disabled"?)
Thanks in advance for your answer.

@aMarCruz

This comment has been minimized.

Show comment
Hide comment
@aMarCruz

aMarCruz Feb 22, 2016

Member

@hajimegane , this bug was introduced by a change in riot which removes the attributes with falsy values except zero, so you can use a number:

  <my-app>
    <button onclick="{toggle}">Click</button>
    <my-tag aaa="{this.flg}" disabled="{this.flg}"></my-tag>
    this.flg = 0
    toggle() {this.flg ^= 1}
  </my-app>

  <my-tag>
    <div>aaa: {opts.aaa}</div>
    <div>disabled: {opts.__disabled}</div>
  </my-tag>

as you are right, disabled is __disabled, but it is better not to use this name because in future versions may be that this behavior change.

Member

aMarCruz commented Feb 22, 2016

@hajimegane , this bug was introduced by a change in riot which removes the attributes with falsy values except zero, so you can use a number:

  <my-app>
    <button onclick="{toggle}">Click</button>
    <my-tag aaa="{this.flg}" disabled="{this.flg}"></my-tag>
    this.flg = 0
    toggle() {this.flg ^= 1}
  </my-app>

  <my-tag>
    <div>aaa: {opts.aaa}</div>
    <div>disabled: {opts.__disabled}</div>
  </my-tag>

as you are right, disabled is __disabled, but it is better not to use this name because in future versions may be that this behavior change.

@aMarCruz aMarCruz removed the to verify label Feb 22, 2016

@hajimegane

This comment has been minimized.

Show comment
Hide comment
@hajimegane

hajimegane Feb 23, 2016

@aMarCruz Thank you for your reply. I tried to set a number value into the disabled attribute but the result is not changed, so the value of opts.disabled is null -> "disabled" -> "disabled".

I think that the special bool attributes that start __ may be not necessary because all attributes with a expression, include not start __, remove automatically if the value is a falsy. And, whether the attribute is removed with the value zero should be unified regardless of the bool attributes such as disabled.
Is this my understanding the right?

Here is my validation code: http://plnkr.co/edit/ycy8moa3N4RrHSyrzCXe

hajimegane commented Feb 23, 2016

@aMarCruz Thank you for your reply. I tried to set a number value into the disabled attribute but the result is not changed, so the value of opts.disabled is null -> "disabled" -> "disabled".

I think that the special bool attributes that start __ may be not necessary because all attributes with a expression, include not start __, remove automatically if the value is a falsy. And, whether the attribute is removed with the value zero should be unified regardless of the bool attributes such as disabled.
Is this my understanding the right?

Here is my validation code: http://plnkr.co/edit/ycy8moa3N4RrHSyrzCXe

@aMarCruz

This comment has been minimized.

Show comment
Hide comment
@aMarCruz

aMarCruz Feb 23, 2016

Member

@hajimegane it is so. The use of __ in boolean attributes comes from earlier versions of riot that support IE8 and it remains for compatibility with existing code, it is likely to be remove in future versions.

Member

aMarCruz commented Feb 23, 2016

@hajimegane it is so. The use of __ in boolean attributes comes from earlier versions of riot that support IE8 and it remains for compatibility with existing code, it is likely to be remove in future versions.

@GianlucaGuarini GianlucaGuarini added this to the 3.0.0 milestone Feb 23, 2016

@hajimegane

This comment has been minimized.

Show comment
Hide comment
@hajimegane

hajimegane Feb 24, 2016

@aMarCruz I understand. Thank you.

hajimegane commented Feb 24, 2016

@aMarCruz I understand. Thank you.

@GianlucaGuarini

This comment has been minimized.

Show comment
Hide comment
Member

GianlucaGuarini commented Oct 15, 2016

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment