JSFiddle - React, Tailwind, and code Playground

by smacky311

HTML

<script src="http://ajax.aspnetcdn.com/ajax/knockout/knockout-3.0.0.js"></script>
<ul data-bind="foreach: places">
    <li>
        <span data-bind="text: $data"></span>
        <button data-bind="click: $parent.removePlace.bind($data, $index())">Remove</button>
    </li>
</ul>

JavaScript

function MyViewModel() {
         var self = this;
         self.places = ko.observableArray(['London', 'Paris', 'Tokyo']);
 
         // The current item will be passed as the first parameter, so we know which place to remove
         self.removePlace = function(place, index) {
             console.log(place);
             console.log(index);
             self.places.remove(place)
         }
     }
     ko.applyBindings(new MyViewModel());