Pass prop using router-view and Vue

Question

I have a Laravel Blade page that calls a Vue page using router-view. I have a "test" prop on the Vue page, but the page is not receiving the prop.

const routes = [
    {path: '/:test', component: MainPageIndex, name: 'mainPageIndex', props: true}
];

The code on the Blade page is:

<router-view name="mainPageIndex" :test="Test message"> </router-view>
<router-view :test="Test message"> </router-view>

Answer 1

There are 2 types of properties: static and dynamic.

• static: test="some message" (for static values)
• dynamic: v-bind:test="variable" (for computed values or objects etc.)

In your case, you should use the static one

test="some message"