Is it possible to reinitialize Vuejs on static php data?

Question

Vue.js

The bottom line is this
There is a mini site, the html of which is completely built on php (using the yii2 framework)
After loading the site, Vuejs comes into play
So, I want Vuejs to be able to work with the data that Php has already given, and not make another ajax request
After all, at the time of VueJs initialization all the data is already there.
Has anyone encountered a similar Wishlist? _)

Answer 1

Common wishlist when crossing php with vue =)
I'm pushing an array of data into a global object
Where on the page:

<script type="text/javascript">
  window.__STATE__ = <?= json_encode($allData) ?>;
</script>

In vue components

created () {
  if (window.__STATE__ && window.__STATE__.myData) {
    this.myData = window.__STATE__.myData;
  } else {
    axios.get( .... )
  }
}

When using Vuex it's even simpler, the only check is when the store is initialized.

Answer 2

data: function () {
            return {
                tokenKey: {{ tokenKey }},
                tokenVal: {{ tokenVal }},
            }
        },

{{ tokenKey }} and {{ tokenVal }} is substituted by the volt template, from php, for example
php makes html, and js is launched in it

Answer 3

Somewhere in the view

$this->registerJs("
    var myVueData = " . yii\helpers\Json::encode($model->attributes) . ";
");

You can connect through the widget, there will be the same slippers, only something like this

$this->view->registerJs("
    var myVueData = " . yii\helpers\Json::encode($this->data) . ";
");