JSFiddle - React, Tailwind, and code Playground

HTML

a<input type="checkbox" data-bind="checked: a" /><br>
b<input type="checkbox" data-bind="checked: b" /><br>
c<input type="checkbox" data-bind="checked: c" /><br>
data: <span data-bind="text: data"></span><br>

<pre data-bind="text: ko.toJSON($data, null, 2)"></pre>

JavaScript

var model = {
    a: ko.observable(false),
    b: ko.observable(false),
    c: ko.observable(false),
    data: ko.observable('')
};

model.allTrue = ko.computed(function () {
    return this.a() && this.b() && this.c();
}, model);

model.query = ko.computed(function () {
    return this.allTrue() ? 'a = ' + this.a() + '; b = ' + this.b() + '; c = ' + this.c() + ';' : null;
}, model);

model.query.subscribe(function (query) {
    if (!query) {
        this.data('no value'); 
        return;
    }
    // load some data...
    this.data(query);    
}, model);

ko.applyBindings(model);