Hello everyone, people help me deal with Vue, for the CEO it is necessary to generate the html code on the server, on the client the minimum functionality with vuejs: filter, hide / show and so on.

<?php /** @var array $direction_list */ foreach ($direction_list as $direction) : ?> <div class="country"> <img src="<?= $direction['CountryImageUrl'] ?>" alt=""> <a class="name" href="<?= $direction['url'] ?>"><?= $direction['CountryName'] ?></a> <a class="price" href="<?= $direction['url'] ?>">от <?= $direction['MinPrice'] ?> руб.</a> <div class="link"><a href="<?= $direction['url'] ?>">Подробнее</a></div> </div> <?php endforeach; ?> 

How can I use html parsing and continue to work with it? It only comes to mind when loading a page to take data on api and replace the entire unit with countries and then work with it. Docks read and google wool nothing adequate. It turns out only the replacement will help, help who is well versed in the twist)

  • one
    when generating the page, transfer to the vue component the data in the form of json as props. On the vue side, get the data and do what you want. - n.osennij 8:38 pm
  • It is necessary to render necessarily html for CEO - Ilgam Karimov
  • google vue js seo - n.osennij
  • great advice! - Ilgam Karimov

1 answer 1

In the view, except for server rendering, there is no other way to transfer data (take data from the markup) to Vuejs.

If SEO requires markup with data, do it as usual on a php server (for example, in my case), then describe the components for Vuejs and indicate the insertion points of these components in the markup. Then the search robots will see the structure that will be generated on the server, and for visitors, when loading the page, Vuejs will compare the data and replace the blocks with the components.

If you need detailed explanations, write, I will try to help.