Яндекс.Метрика
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  

Working with linked tables in Laravel+ Vue 3: ways to output fields

Working with linked tables in Laravel+ Vue 3: ways to output fields

When developing a more or less serious Laravel application in conjunction with Vue, there is always a need to interact with various fields of related tables (entities) using the primary key.

Processing and output of related fields MySQL tables can be implemented in two main ways:

  • Merging related tables on the controller side:

    On the controller side, you can combine related tables by primary key id and then output the finished collection to client (browser). For example, using Eloquent methods for greedy loading:

    
    $users = User::with('posts')->get();
                

    As a result, we will receive user data along with their posts in a single query, which will reduce loading time and the number of database queries.

    Or a leftJoin query of this type :

    Working with linked tables on Laravel + Vue3 -1

  • Output of separate collections of each entity:

    In this approach, we first load individual collections for each entity in the controller and pass them to the client. On the client side, we can go through the object in a loop and match the IDs of related collections to output the necessary fields. For example:

    
    $users = User::all();
    $posts = Post::all();
    return response()->json(['users' => $users, 'posts' => $posts]);
                

    Then we process the received data on the client:

    
    // Then on the client side
    , users.forEach(user => {
        const userPosts = posts.filter(post => post.user_id === user.id);
        // Output of the required fields of the user and his posts
    });
                

Both approaches have their pros and cons:

  • Combining data on the controller side:
    • Advantages: Reducing the number of database queries and simplifying the client code.
    • Disadvantages: Less flexibility when changing requirements and the ability to transfer too much data if there are many related records.
  • Output of individual collections:
    • Advantages: More flexible data management, the ability to upload only the necessary information.
    • Disadvantages: An increase in the number of requests, which may reduce the performance of the application.

The choice of approach depends on the specific context of your application and its requirements. It is recommended to analyze them within the framework of the project and choose the optimal solution, taking into account the performance and convenience of support.

автор - Михаленко Р.
M R. Автор - kaktotak.by Specialization: financial and economic design - modeling of business, investment projects of the real sector, analysis and evaluation of efficiency, optimization of the management decision system.

A wide range of web-based competencies for solving business problems.

Subscribe to my telegram channel - My notes are ECONOMICS +
Там я ничего не втюхиваю и не навязываю. Просто делюсь полезной информацией по экономической грамотности. Повышайте своё качество вместе со мной: что, как и почему в экономике на простом языке. Понятия, алгоритмы, процессы, микро- и макроаспекты и многое другое. Может, будет интересно !

And also - WEB Developer's Guide | php+js+seo
Notes and native solutions to simple local tasks in PHP, JS. Something about Laravel, WordPress, Vue and SEO.

  Personal assistance in economic design and web development:

  • Financial and economic modeling, analysis, accounting, business planning
  • Comprehensive web development/project support on the web (php/js, seo – Laravel, WordPress, Vue, telegram, administration, content, advertising in Yandex Direct

  telegram или форма обратной связи

Administrator
48
0
Name
E-mail
Rating
Review

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