2

In my Laravel 5.8 / "vue": "^2.6.10"/ app I need to open url in other tab in js code. I found example 

let routeData = this.$router.resolve({name: 'routeName', query: {data: "someData"}});
window.open(routeData.href, '_blank');

here Can vue-router open a link in a new tab?

but implementing it I did not find valid way :

let routeData = this.$router.resolve(  {name: 'editHostel', query: {params: { id : 48 } }  });


            OR

let routeData = this.$router.resolve(  {name: 'editHostel', query: {id: date.id}}  );


        window.open(routeData.href, '_blank');

in both case generated url was invalid.

In resources/js/routes.js I have :

{
    path: '/admin/hostels',
    component: hostelsContainer,
    meta: {
        requiresAuth: true,
        authGroupsAccess: ['Admin', 'Manager'],
    },
    children: [
        {
            path: '/admin/hostels/',
            component: hostelsList,
            name: 'listHostels'
        },
        {
            path: '/admin/hostels/new',
            component: editHostel,
            name: 'newHostel'
        },
        {
            path: ':id',
            component: editHostel,
            name: 'editHostel'
        },

Which way is valid ?

mstdmstd
  • 2,195
  • 17
  • 63
  • 140

2 Answers2

2

I found a decision based on link Can vue-router open a link in a new tab? as :

let routeData = this.$router.resolve(  { path: '/admin/hostels/' + date.originalEvent.hostel_id +"/open_hostel_inquery_feedback/"+date.id});
window.open(routeData.href, '_blank');

That works for me!

mstdmstd
  • 2,195
  • 17
  • 63
  • 140
0

Don't make SPA(single page application) within laravel. If you really want to create SPA then use vue cli

Otherwise, use vue.js as a replacement for jQuery. That gives you more power of making an interactive website using laravel and vue.js in a single project.

You will be able to use blade views where you don't have to use vue and vice versa.

Afraz Ahmad
  • 5,193
  • 28
  • 38
  • Afraz Ahmad, though your answer seems off topic, I am intereted :1) please, a bit more detailed why? 2) what can be used for db operations? 3) Please, provide a link with examples of proper SPA with db operations implementation... – mstdmstd Oct 27 '19 at 05:55
  • what do you mean by db operations ? Are you talking about ajax calls to server ? If yes then you can use axios https://github.com/axios/axios to do so. – Afraz Ahmad Oct 27 '19 at 06:55
  • 1
    Look at this https://github.com/gothinkster/vue-realworld-example-app this is very good repo. But they are using best practices that can be overwhelming at first. – Afraz Ahmad Oct 27 '19 at 06:58
  • Thanks for the link, very interesting, but where is part working with db? I mean read/write data from/to db. Some it be some different app, as api endpoint ? In the source of t5he app I found link to https://conduit.productionready.io/api Is it some api endpoint ? – mstdmstd Oct 27 '19 at 13:03
  • 1
    It is SPA in vue.js + vuex. It is using APIs to handle DB part. – Afraz Ahmad Oct 28 '19 at 05:20
  • If there DB part public ? – mstdmstd Oct 28 '19 at 08:33