JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.0/knockout-min.js"></script>
<img alt="Foo" data-bind="safeSrc: {src: imageOne, fallback: 'https://placeholdit.imgix.net/~text?txtsize=38&txt=I%20am%20a%20fallback!'}" /><br />
<img alt=Bar data-bind="safeSrc: {src: imageTwo, fallback: 'https://placeholdit.imgix.net/~text?txtsize=38&txt=I%20am%20a%20fallback!'}" />

JavaScript

var ViewModel = function() {
  this.imageOne = ko.observable('https://placeholdit.imgix.net/~text?txtsize=38&txt=This%20Image%20Exists');
  this.imageTwo = ko.observable('http://example.com/img/DOES_NOT_EXIST.png');
};

ko.bindingHandlers.safeSrc = {
  update: function(element, valueAccessor) {
    var options = valueAccessor();
    var src = ko.unwrap(options.src);
    $('<img />').attr('src', src).on('load', function() {
      $(element).attr('src', src);
    }).on('error', function() {
      $(element).attr('src', ko.unwrap(options.fallback));
    });
  }
};

$(function() {
  ko.applyBindings(new ViewModel());
});