JSFiddle - React, Tailwind, and code Playground

by rdvornov

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/basis.js/1.3.1/basis.js"></script>

JavaScript

basis.ready(function(){
var Node = basis.require('basis.ui').Node;
var createAction = basis.require('basis.net.action').create;

var view = new basis.ui.Node({
  container: document.body,
  counter: new basis.Token(0),  // используем для упрощения,
                                // чтобы не вызывать this.updateBind('counter')
  template:
    '<div>' +
      '<button event-click="inc">{count}</button>' +
      '<br/>состояние узла {state}' +
    '</div>',
  binding: {
    count: 'counter'
  },
  action: {
    inc: function(){
      this.updateCounter(1);
    }
  },
  updateCounter: createAction({
    method: 'POST',
    url: '/echo/json/',
    request: function(add){
      // this -> владелец action
      // this === view
      return {
        params: {  // для упрощения отправляется число
          json: this.counter.value + add
        }
      };
    },
    success: function(data){
      // в демонстрации, что отправляется, то и приходит
      // здесь будет новое значение для counter
      this.counter.set(data);
    }
  })
});
});