README

替换为 yii2-bootstrap

安装

安装此扩展的首选方式是通过 composer。

运行以下命令之一

php composer.phar require --prefer-dist error500/yii2-bootstrap-vue "*"

或者在您的 composer.json 文件的 require 部分添加

"error500/yii2-bootstrap-vue": "*"

to

用法

扩展安装后，只需在您的代码中通过以下方式使用它

• 将 vueApp 组件添加到您的 web 应用的配置中

    componets => [
        ...
        'vueApp' => [
            'class' => 'yii\bootstrap_vue\VueObject',
        ],
        ...
    ]

在视图中添加 VueAsset

    VueAsset::register($this);

使用小部件

<?php $form = \yii\bootstrap_vue\widgets\ActiveForm::begin(); ?>
    <div class="row">
        <div class="col-xs-12 col-md-6">
            <?php echo $form->field($model, 'attribute', [])
                    ->text()
                    ->label();
            ?>
        </div>
    </div>
<?php \yii\bootstrap_vue\widgets\ActiveForm; ?>

在视图文件中添加 bootstrap-vue https://vue.bootstrap.ac.cn/docs/components

<?php
BootsrapVueAsset::register($this);
Yii::$app->vueApp->methods = [
    'fileChange' => 'function(file){
        ... some javascript code of root vue app object method ...
    }'
]
Yii::$app->vueApp->data = [
    'file' => null,
];
>
<b-container>
    <b-row>
...
        <b-form-file @change="fileChange" v-model="file"></b-form-file>
...
    </b-row>
<b-container>

在任何代码位置与主 Vue 应用一起工作

Yii::$app->vueApp->data = [
    'prop1' => null,
    'prop2' => false,
    'prop3' => string,
]

Yii::$app->vueApp->methods = [
    'methodName' => 'function(args) {
        method javascript code
    }'
]
Yi::$app->vueApp->computed = [
    'computedPropName' => 'function(){ javascript }'
]