returning null in a view

Returning null throws errors, is there a way not to return a root node?

render(vm) {
    return vm.state.bool ? <div>foo</div> : null;
}

[leeoniya]

probably the most ergonomic way to achieve a near-equivalent of a null return is to return a comment node for the view’s root. this means that the view is effectively unmounted and out of the dom, but is still retained by domvm:

var el = domvm.defineElement;
var cm = domvm.defineComment;
var vw = domvm.defineView;
var cv = domvm.createView;

var vis = true;

function AppView(vm) {
  return function() {
    return el("#app", [
      vw(SubView) 
    ]);
  };
}

function SubView() {
  var i = 0;
  
  setInterval(function() {
    i++;
  }, 200);
  
  return function() {
    return vis ? el("div", "abc " + i) : cm("SubView " + i);
  };
}

var vm = cv(AppView).mount(document.body);

setTimeout(function() {
  vis = false;
  vm.redraw();
}, 3000);

setTimeout(function() {
  vis = true;
  vm.redraw();
}, 6000);

[leeoniya]

ah, ok.

i’ll give this some thought. it’s not a quick fix, but i see how it’s useful and better than create & inject, though i do wonder if that can be made into something similar without modifying the core.

i don’t see anything in https://reacttraining.com/react-router/web/example/basic that can’t be replicated with a bit of js and domvm. this “maintaining view state despite unmounting in a declarative way” seems to be the thorny part.

would be interesting to do a proof of concept with createView, injectView and vm memoization to simulate this. it’s certainly possible, though the ergonomics could be anywhere on the scale from not-too-bad to wtf.