Яндекс.Метрика
qr-код - Как-то так стрелка - Как-то так
Leading Economist + ... пиктограмма - Как-то Так THIS     Economic literacy and web solutions
All on the topic: what, how and why. Actual things - in their own words.
Turn your quality WITH ME - BUTW !
If you don't like what you get, change what you give. © Carlos Castaneda     KAKTOTAK.BY - economic design and web development services (php/js - telegram, WordPress, Laravel, Vue, SEO)    Cooperation - on an ongoing basis    Be in the topic   -    SUBSCRIBE      My notes are ECONOMICS +  и  WEB Developer's Guide | php+js+seo   в Telegram   telegram  

How to redirect data from the controller to the View component

Step 1: Preparation on the Laravel side

Controller

In the Laravel controller, we process the logic and use the with() method to transfer data to the session. For example:


public function someAction()
{
// Logic processing...
// For example, the user is denied access and we redirect him to the authorization page

    // Storing the message in the session
    return redirect('/some-route')->with('message', 'Data successfully transmitted!');
}
                    

Transferring data to a view

Make sure that the data transmitted in the session is transmitted to the target controller in accordance with the specified route (route - /some-route). For example:


public function showLogin(): Response
{
return Inertia::render('Auth/Login', [
'message' =session('message'), // Passing data from the session
    ]);
}
                    

Step 2: Getting data on the Vue side

Using the script setup Composition API to get the props

Open the component to which we want to transfer the data.

Since we pass data directly to our component in the form of passes, we can simply access them without using usePage :

<template>
    <div>
        <div v-if="message" class="alert alert-info">
            {{ message }}
        </div>
        <h1>Welcome!</h1>
    </div>
</template>

<script setup>
// <![CDATA[
// We accept defineProps
({
  message: {
    type: String,
  },
});
// ]]>
</script>

Now, when we go to the page, the information from the session will be shown in our Vue component.

Administrator
122

Currency Converter
RUB RUB-icon
USD USD-icon
EUR EUR-icon
CNY CNY-icon
BYN BYN-icon
UAH UAH-icon
KZT KZT-icon
SHORT- what is it about
ECONOMIC LITERACY
  Simple online solutions to problems of economics and finance  
I Want To Know Everything. Useful Tips