JSFiddle - React, Tailwind, and code Playground

by air_hadoken

HTML

<script src="http://canjs.us/release/latest/can.jquery.js"></script>
<script src="http://canjs.us/release/latest/can.view.mustache.js"></script>
  <body>
    
<script type="text/mustache" id="example">
  {{#next_level}}
    Text: "<span {{ (el) -> el.data("foo", "bar") }}>{{text}}</span>"
  {{/next_level}}
</script>
  
  </body>

JavaScript

$(function() {

    var obj3 = can.Model.model({});
    
    var obj2 = can.Model.model({
        objs : [obj3]
    });
    
var obj = can.Model.model({
    objs : [obj2]
});
    obj3.attr("objs", new can.Observe.List([obj]));
    
    //obj.bind("obj", function(ev, newVal) { 
    //    $(document.body).append("New mid level: " + newVal + "<br>");
    //});
    
    obj.bind("change", "objs", function(ev, attr, how, newVal) { 
        $(document.body).append("New change for " + attr + ": " + newVal + "<br>");
    });
    
    //$(document.body).append(obj.serialize());
    obj2.attr("objs", [])
});