My target is to fire a redirect url event with reactjs. How is that possible? Already tried:
successRedirect(){
this.transitionTo('/');
}
and
successRedirect(){
this.router.transitionTo('/');
}
use push instead transitionTo
this.context.router.push('/contact');
MyClass.contextTypes = {
router: React.PropTypes.func.isRequired
}
// app.js
// a bunch of things here :D
var routes = require('./routes');
var RouterContainer = require('./router');
RouterContainer.set(Router.create({
routes: routes
}));
// someUtils.js
var router = require('../router');
router.get().transitionTo('home');
Related
I'm trying to set up a router for my backbone application. However when i go to localhost:8888/extractors or localhost:8888/extractors/new. neither of the console messages are being outputted. How come when it is defined in the router itself?
require(['new-extractor-view', 'extractors-collection', 'backbone'], function (NewExtractorView, ExtractorsCollection) {
'use strict';
var extractorCollection = new ExtractorsCollection();
new NewExtractorView({
collection: extractorCollection
});
//
// Initialize URL router
//
var AppRouter = Backbone.Router.extend({
routes: {
'extractors': 'extractorsRoute',
'extractors/new': 'newExtractorRoute',
'*actions': 'defaultRoute'
}
});
var appRouter = new AppRouter;
appRouter.on('route:extractorsRoute', function () {
console.log('test1')
});
appRouter.on('route:newExtractorRoute', function () {
console.log('test2')
});
Backbone.history.start();
});
If you want to use url's without # you should initialize history like:
Backbone.history.start({ pushState: true })
Read more about the pushState option.
The code looks ok to me, but I think you forgot the brackets when creating the new router:
var appRouter = new AppRouter();
Edit: Oh and I'm quite sure Backbone will only match localhost:8888/#extractors (with a leading hashtag) but not localhost:8888/extractors as described here.
I have
var Router1 = Backbone.Router.extend({
routes: {
'': 'index',
'view': 'view1'
}
});
var router1 = new Router1();
router1.on('route:index', function(){
alert('Index Page');
});
router1.on('route:view1', function(){
alert('View 1');
});
Following Urls do not do anything
http://localhost:8080/App1/index.html /*should give alert('Index Page')*/
http://localhost:9090/App1/index.html#view /*should give alert('View1')*/
Your router will work for the URLs like
http://localhost:8080/
http://localhost:8080/#view
Make sure you call Backbone.history.start() to route the initial URL.
I have the following routes:
var Workspace = Backbone.Router.extend({
routes: {
"": "index"
},
index: function() {
...
}
});
At now I can trigger this route like this Backbone.history.navigate('', true); and all works fine. But now I need to add GET params to that router to be possible trigger and handle route like this:
var Workspace = Backbone.Router.extend({
routes: {
"?:query": "index"
},
index: function(query) {
...
}
});
But unfortunately my index callback don't get executed when I trigger Backbone.history.navigate('?needShowPopup=true', true);
How should I define and trigger route to pass and handle GET parameters for my index route?
I would do that
var Workspace = Backbone.Router.extend({
routes: {
"*": "index"
},
index: function() {
var query = location.search;
// work with query
}
});
Let me know if you get a problem.
I'm trying to integrate Backbone inside a PHP CMS.
The root url for my Backbone app is:
http://localhost/administrator/index.php?option=com_test&controller=product.list
I have setup my router like this:
var AppRouter = Backbone.Router.extend({
routes: {
'': 'test',
}
});
var initialize = function () {
var router = new AppRouter;
router.on('test', function () {
console.log('match');
});
Backbone.history.start({
pushState: true,
root: '/administrator/index.php?option=com_test&controller=product.list'
});
router.navigate('/', {trigger: true});
};
The navigate function is correctly called but the route never matches.
I tried to add a trailing backslash in the root, but it doesn't not change anything.
The problem is that you should either add test method to Router like that:
var AppRouter = Backbone.Router.extend({
routes: {
'': 'test',
},
test: function(){
console.log('test route');
}
});
or listen to route:test event:
router.on('route:test', function () {
console.log('match');
});
because Backbone.Router triggers routes names when matched with prefix route:
When I define a route explicitly, Ember fails to render the associated template. Do I have to specify in the route object the renderTemplate property every time I create an explicit route? Just to be more clear, here is my example:
define(['ember'],
function(Ember) {
"use strict";
var DudeRoute = Ember.Route.extend({
model: function() {
},
setupController: function() {
},
renderTemplate: function() {
}
});
return DudeRoute;
});
and if I specify in my app like this:
define([ ... ],
function(
Router,
IndexRoute,
DudeRoute,
ApplicationController,
IndexController
) {
"use strict";
/*Module Pattern*/
var App = {
LOG_TRANSITIONS: true,
Router: Router,
// Load routes
IndexRoute: IndexRoute,
DudeRoute: DudeRoute,
//Load Controllers
ApplicationController: ApplicationController,
IndexController: IndexController
//Load Models
//Load Views
};
return App;
});
The whole thing falls apart, it does not render my template. Though if I remove DudeRoute everything works fine.
OK, I figured it out. So My problem was, that I was using some automation to generate code for Route/Controller/View/templates. And what I did and you can see from the code too is that I stupidly set the renderTemplate method to do nothing. So by removing it it will work.