antkaz/yii2-vue The Vue.js extension for the Yii framework


Vue.js Extension for Yii2

This is the Vue.js extension for Yii2.


The preferred way to install this extension is through composer.


php composer.phar require antkaz/yii2-vue

or add

"antkaz/yii2-vue": "~1.0"

to the require section of your composer.json file.


After installing the extension, just use it in your code:


use antkaz\vue\Vue;
use \yii\web\JsExpression;
<div class="vue">
    <?php Vue::begin([
        'clientOptions' => [
            'data' => [
                'message' => 'Hello Vue!'
            'methods' => [
                'reverseMessage' => new JsExpression("function() {this.message = this.message.split('').reverse().join('')}")
    ]) ?>

    <p>{{ message }}</p>
    <button v-on:click="reverseMessage">Reverse Message</button>

    <?php Vue::end() ?>

Alternative method without using a widget:


use antkaz\vue\VueAsset;
VueAsset::register($this); // register VueAsset

<div id="app" class="vue">

    <p>{{ message }}</p>
    <button v-on:click="reverseMessage">Reverse Message</button>


    var app = new Vue({
        el: '#app',
        data: {
            message: 'Hello Vue.js!'
        methods: {
            reverseMessage: function () {
                this.message = this.message.split('').reverse().join('')
0 0
1 follower
22 300 downloads
Yii Version: 2.0
License: MIT
Category: User Interface
Tags: vue, vuejs
Developed by: Anton Kazarinov
Created on: Apr 6, 2018
Last updated: (not set)
Packagist Profile
Github Repository

Related Extensions