Is there a convention for component attribute lettercase (dasherized or camelCase)?

1

I have not found something in the docs about this (the components there use short attribute names only). As the [answer to a similar question on StackOverflow] (ember.js - Ember 2.0 components - attribute naming convention - Stack Overflow) is somewhat flimsy (“it seems that…”) and has no upvotes yet, I wondered if there is a preference among ember developers (and why) or (even better) if there was a consensus or recommendation that I just couldn’t find.

Edit: To clarify, do you prefer {{my-component an-attribute=whatever}} over {{my-component anAttribute=whatever}} or the other way around and why?

The first is probably more comfortably fit into HTML, as HTML itself doesn’t favour camel-case but uses dasherized names. The latter feels more natural in JavaScript code (at least to me).

Thoughts?

1 Like
2

All examples I’ve seen so far use dashed and not camel case. I don’t know if its consensus but it makes file name for components better at least to me

3

ah, I wasn’t talking about the component’s name (the dash is required in these), but the attributes to the component.

4

I’m quite curious as well. For the upcoming attrs in angle-brackets, I usually see examples using this.attrs.someAttribute rather than this.attrs['some-attribute'] so I’m expecting the most common is to use camelCase.

But the way I do it now, if the attribute is something that will be used for directly for HTML, as-in that it represents a property in the HTML element at a high-level view (e.g. placeholder for <input> or maybe a completely new one like charcounter for <input> too) then I’d go for one-word with no dashes since that’s how they do properties in HTML elements. With the exception of data-* attributes. For that, I use dasherized names.

If however, it’s something that doesn’t represent an HTML property like userfirstName then I do camelCase.

I hope that makes sense but I’m also curious as to how other devs do it.

1 Like