GitHub
Twitterdata
An observable key-value object used to cross bind to the url observable urlData. Set it to cross-bind a top level state object (Application ViewModel) to can-route.
Object
If route.data is set to a can-reflected observable object of
key-value pairs, once start is called, changes in route.data's
properties will update the hash and vice-versa. route.data defaults to a can-observable-object.
<mock-url></mock-url>
<script type="module">
import {ObservableObject, route} from "can";
import "//unpkg.com/mock-url@^5.0.0/mock-url.mjs";
route.data = new ObservableObject( {page: ""} );
route.register( "{page}" );
route.start();
location.hash = "#!example";
setTimeout(()=> {
console.log( route.data ); //-> {page: "example"}
}, 100);
</script>
HTMLElement
If route.data is set to an element, its
observable can-view-model will be used as the observable connected
to the browser's hash.
Deprecated
Assigning an HTMLElement to route.data has been deprecated in favor of setting it to an observable. If you have any further questions please refer to the Routing guide.
For in-depth examples see the the Routing guide.
Use
route.data defaults to can-observable-object, but route.data can be set to any observable. The following uses can-define/map/map:
import { DefineMap, route } from "can/everything";
route.data = new DefineMap();
route.register( "{page}", { page: "home" } );
route.start();
console.log( route.data.page ) //-> "home"