我使用Yii 2.0高级模板,后端想要这样的东西:
左侧的菜单应包含项目,当点击这些项目时,相应的页面将在右侧打开。左侧的菜单应该是静态的,并且在单击项目时不会失去焦点。
这意味着我可能需要使用部分视图?是否有一些扩展/小部件正在做我需要的?我是Yii的新人,所以我真的不知道如何解决这个问题。任何建议或想法将不胜感激。我确定我不是唯一一个在Yii中需要这个,但在谷歌上找不到的东西。
答案 0 :(得分:1)
我认为最简单的方法是使用布局。您可以使用左侧的菜单和页面其余部分的主页面来定义布局。
这可能是一个布局样本,例如:'mylayout.php'
<?php
use yii\helpers\Html;
use yii\bootstrap\Nav;
use yii\bootstrap\NavBar;
use yii\widgets\Breadcrumbs;
use frontend\assets\AppAsset;
/* @var $this \yii\web\View */
/* @var $content string */
AppAsset::register($this);
?>
<?php $this->beginPage() ?>
<!DOCTYPE html>
<html lang="<?= Yii::$app->language ?>">
<head>
<meta charset="<?= Yii::$app->charset ?>">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="shortcut icon" href="<?php echo Yii::$app->request->baseUrl; ?>/dfenx.ico" type="image/x-icon" />
<?= Html::csrfMetaTags() ?>
<title><?= Html::encode($this->title) ?></title>
<?php $this->head() ?>
</head>
<body>
<?php $this->beginBody() ?>
<div class="wrap">
<?php
NavBar::begin([
'brandLabel' => $this->title = Yii::$app->name ,
'brandUrl' => Yii::$app->homeUrl,
'brandOptions' =>[
'style' => 'font-family: palatino; font-size:24px;'
],
'options' => [
//'class' => 'navbar-inverse navbar-fixed-top',
'class' => 'navbar-default navbar-fixed-top',
],
]);
$menuItems = [
['label' => 'Home', 'url' => ['/site/index']],
['label' => 'About', 'url' => ['/site/about']],
['label' => 'Contact', 'url' => ['/site/contact']],
];
if (Yii::$app->user->isGuest) {
$menuItems[] = ['label' => 'Signup', 'url' => ['/user/register']];
$menuItems[] = ['label' => 'Login', 'url' => ['/user/login']];
} else {
$menuItems[] = [
'label' => 'Logout (' . Yii::$app->user->identity->username . ')',
'url' => ['/user/logout'],
'linkOptions' => ['data-method' => 'post']
];
}
echo Nav::widget([
'options' => ['class' => 'navbar-nav navbar-right'],
'items' => $menuItems,
]);
NavBar::end();
?>
<div class="container">
<?= Breadcrumbs::widget([
'links' => isset($this->params['breadcrumbs']) ? $this->params['breadcrumbs'] : [],
]) ?>
<div class='col-lg-3 col-md-3' >
<!-- here your left menu -->
</div>
<div class='col-lg-9 col-md-9' >
<!-- here your content page-->
<?= $content ?>
</div>
</div>
</div>
<footer class="footer">
<div class="container">
<p class="pull-left">© Digital FenX <?= date('Y') ?></p>
<p class="pull-right"><?php // Yii::powered() ?></p>
</div>
</footer>
<?php $this->endBody() ?>
</body>
</html>
<?php $this->endPage() ?>
在控制器中,您可以设置想要以这种方式使用的布局
public function actionYourAction()
{
$this->layout = 'mylayout';
return $this->render(ourView', [
'model' =>$model,
'dataProvider' => $provider,
]);
}