Add some form of reference/alias to root tag name
thomasjo opened this issue · comments
Thomas Johansen commented
Right now the element's root tag is duplicated in both the registration and the render
method—e.g.
const TaskList = etch.defineElement('div', {
// Define the element's content via a `render` method
render () {
return (
<div className='task-list'>
<h1>Tasks:</h1>
<ol>{
this.tasks.map(task =>
<li className='task' key={task.id}>
<input type='checkbox' checked={task.completed}>
task.description
</li>
)
}</ol>
</div>
)
},
// ...
It would be awesome if this could be avoided by introducing some type of reference, alias or some such. Perhaps something like
const TaskList = etch.defineElement('div', {
// Define the element's content via a `render` method
render () {
return (
<root className='task-list'>
<h1>Tasks:</h1>
// ...
Nathan Sobo commented
The root tag name is available as the standard tagName
property on the element itself, though it's capitalized. I do agree it's a bit of a bummer to have to repeat the tag name, but I'm not sure it's worth the complexity of adding a whole facility for this.
Thomas Johansen commented
Given the upcoming changes, this issue is no longer valid 💥