component / reactive

Tiny reactive template engine
383 stars 48 forks source link

Child binding #152

Closed vweevers closed 10 years ago

vweevers commented 10 years ago

Wondering if this should be in core. Allows you to do:

<article child="book">
  <h1>{title} by {author}</h1>
</article>
var model = { 
  book: { 
    title: 'Siddhartha', 
    author: 'Hermann Hesse'
  }
}

Instead of:

<article>
  <h1>{book.title} by {book.author}</h1>
</article>
defunctzombie commented 10 years ago

scope might be a better word for it, but I dunno. I kinda like the second one. Even though you type book twice, to me it looks easier to read and see what is going on.

vweevers commented 10 years ago

Yeah, i hate naming things. I like scope. Agree that second one is easier to read, so a better example would be something with nested properties, like <h1>{book.metadata.title} by {book.metadata.author}</h1>.

Another benefit:

<div child="book" on-click="buyBook">{title}</div>
view.buyBook = function(el, ctx) {
  // ctx.model is a book
}
vweevers commented 10 years ago

Performance hit is too big. Re-rendering entire element is costly.