Setting ...options.root on a vue instance, using router params

[Miguel-Frazao]

I have something like this on my main.js before Vue instatiation:

if(typeof localStorage.lang === 'undefined')
    lang = 'pt';
else {
    if(localStorage.lang === 'pt')
        lang = 'pt';
    else
        lang = 'en';
}

Vue.http.options.root = 'http://127.0.0.1:8000/api/webapp/' +lang;

On my router:

export default new Router({
  routes: [
    {
      {
          path: ':lang/foo',
          component: {
            ....
          },
       }
    }
 ]});

And I am trying to do something like this on my main component App.vue:

export default {
  name: 'app',
  watch: {
    '$route.params.lang': function(new_val, old_val) { // ex: new_val is now en
      this.$http.options.root = 'http://127.0.0.1:8000/api/webapp/' +new_val; <-- trying to change root endpoint
      localStorage.setItem('lang', new_val);
      console.log(new_val); // en
      console.log(localStorage.lang); // en
      console.log(this.$http.options.root); // http://127.0.0.1:8000/api/webapp/pt <-- doesn't change
    }
  }
};

I need to change the root endpoint for the api, or an alternative not far from this simple implementation.