import Hello from 'hello.js'
Omi.makeHTML('Hello', Hello);
class App extends Omi.Component {
 render() {
 return `
 <div>
 <Hello :data-user="{ name : 'Dntzhang', favorite : 'Omi' }" />
 </div>
 `
 }
}
Omi.render(new App(),"#container")

class Hello extends Omi.Component {
 render() {
 return `
 <div>
 <h1>{{user.name}} love {{user.favorite}}.</h1>
 </div>
 `
 }
}

<Hello :data-age="18" />
 <Hello :data-xxx="1+1*2/3" />
 <Hello :data-is-girl="false" />
 <Hello :data-array-test="[1,2,3]" />

class Hello extends Omi.Component {
 handleClick(evt){
 alert( this.data.arrayTest[0].name)
 }
 render() {
 return `
 <ul>
 {{#arrayTest}}
 <li onclick="handleClick">{{name}}</li>
 {{/arrayTest}}
 </ul>
 `;
 }
}
Omi.makeHTML('Hello', Hello);
class App extends Omi.Component {
 render() {
 return `
 <div>
 <Hello :data-array-test="[{name:'dntzhang'},{name:'omi'},{name:'AlloyTeam'}]" />
 </div>
 `;
 }
}
Omi.render(new App(),"#container");

class Hello extends Omi.Component {
 render() {
 return `
 <ul>
 ${this.data.arrayTest.map(item =>
 `<li>${item.name}</li>`
 ).join('')}
 </ul>
 `;
 }
}