JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://rawgithub.com/webcomponents/webcomponentsjs/v0.6.0/webcomponents-lite.min.js"></script>
<script src="https://rawgithub.com/pitana/pitana.js/1.0.3/dist/pitana.min.js"></script>
<h1>Pitana Hello World Element Demo</h1>
<button onclick="document.getElementById('tag').count=3">Change Count to 3</button>
<hello-world id="tag" name="James" count="5"></hello-world>
JavaScript
pitana.register({
tagName: "hello-world",
accessors: {
name: {
type: "string"
},
count: {
type: "int",
onChange: "attachedCallback"
}
},
attachedCallback: function () {
var s = [];
for (var i = 0; i < this.$.count; i++) {
s.push("<p>Hello " + this.$.name + "</p>");
}
this.$.innerHTML = s.join("");
}
});