exports.* does not effect on-screen elements

index.js

$.hide.addEventListener("click", function(e) {
  var views = Alloy.createController("views");
  views.hide();
});

$.index.open();

index.xml

<Alloy>
  <Window class="container">
    <Require src="views" id="views"/>
    <Button id="hide">Hide The View</Button>
  </Window>
</Alloy>

views.js

// Would hide the 'theView' button
$.theView.addEventListener("click", function() { $.theView.hide(); });

// Would *NOT* hide the 'theView' button
exports.hide = function() { $.theView.hide(); };

views.xml

<Alloy>
  <View class="container">
    <Button id="theView">The View</Button>
  </View>
</Alloy>