Does it support conditional render html attribute?
See original GitHub issuev-if can conditional render html element, but I want to conditional render html attribute.How can I do that?
I prefer it like this:
<input :diabled="v-if {{flag}}" type="text">
if flag == true, rendered result is
<input diabled type="text">
if flag == false, rendered result is
<input type="text">
ps:diabled=“false” is the same as disabled=“true” 😃
Issue Analytics
- State:
- Created 8 years ago
- Reactions:2
- Comments:6 (3 by maintainers)
Top Results From Across the Web
Does it support conditional render html attribute? #243 - GitHub
Yes, I can do this in another way, but it's much straightforward if there is a conditional rendering directive. 1
Read more >How to conditionally render plain HTML elements like <div>s?
The right JSF component to represent a HTML <div> element is the <h:panelGroup> with the layout attribute set to block . So, this...
Read more >Conditional Rendering of Html in Vue JS - LinkedIn
To render the html based on the specific conditions of the states you can use the if and else conditioning as an attribute...
Read more >Creating an If Tag Helper to conditionally render content
First, whether or not we render the inner content, we want to ensure the <if> attribute is not rendered to the final output....
Read more >4 Methods to Add Conditional Attributes to React Components
Before moving to the implementation, we should understand how React's underlying architecture renders conditional attributes.
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
If you want to put an attribute with a value.
:your-attr="flag ? 'attr-value' : false"
In some situations, the ability of conditional rendering of html attributes is still needed, for example, the breadcrumb,
<el-breadcrumb-item :to="{ path: '/' }">home</el-breadcrumb-item>
, if the “to” attribute isn’t needed, it cannot be<el-breadcrumb-item :to="false">home</el-breadcrumb-item>
, the “to” attribute is the same as<router-link>
.Yes, I can do this in another way, but it’s much straightforward if there is a conditional rendering directive.