目前我正在尝试设置使用相同模板的分段路由。目前,基本路线/我的仪表板视图使用布局。这适用于基本路线。但在尝试添加子段路由后,布局css和js路径不正确。我希望/我的仪表板/想法/我的面板/什么/我的控制板/什么/更新/777下的任何部分使用相同的布局,但视图不同。以及布局,以便为每个视图提供正确的css和js路径。
route.config.php
'dashboard' => array(
'type' => 'literal',
'options' => array(
'route' => '/my-dashboard',
'defaults' => array(
'controller' => 'dashboard',
'action' => 'dashboard',
),
),
'may_terminate' => true,
'child_routes' => array(
'wahtever' => array(
'type' => 'Segment',
'options' => array(
'route' => '/ideas',
'defaults' => array(
'controller' => 'ideas',
'action' => 'ideas',
),
),
),
),
),
如果我转到/我的仪表板,它将显示正确的视图和我想用于这些路线的布局。如果我转到/my dashboard/iideas,路线会解决,但当在控制台中查看时,所有的css和js都被404搞砸了,找不到这样那样的东西。如果我加上../在布局中,它将在嵌套路由上工作,但随后会破坏/my仪表板路由。
module.config.php
'view_manager' => array(
'template_map' => array(
'layout/my-dashboard-layout' => __DIR__ . '/../view/layout/my-dashboard-layout.twig',
'wmi/dashboard/dashboard' => __DIR__ . '/../view/dashboard/dashboard.twig',
'wmi/ideas/ideas' => __DIR__ . '/../view/ideas/ideas.twig',
)
),
编辑以添加布局和视图。layout/my-dashboard-layout.twig
<!DOCTYPE html>
<html>
<head>
<!-- Theme CSS -->
<link rel="stylesheet" type="text/css" href="skin/default_skin/css/theme.css">
<!-- Admin Panels CSS -->
<link rel="stylesheet" type="text/css" href="admin-tools/admin-plugins/admin-panels/adminpanels.css">
<!-- Admin Forms CSS -->
<link rel="stylesheet" type="text/css" href="admin-tools/admin-forms/css/admin-forms.css">
<!-- Favicon -->
<link rel="shortcut icon" href="img/favicon.ico">
</head>
<body class="dashboard-page sb-l-o sb-r-c">
<!-- Start: Content-Wrapper -->
<section id="content_wrapper">
{% block content %}{{ content|raw }}{% endblock content %}
</section>
<!-- jQuery -->
<script type="text/javascript" src="js/jquery/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="js/jquery/jquery_ui/jquery-ui.min.js"></script>
<!-- Bootstrap -->
<script type="text/javascript" src="js/bootstrap/bootstrap.min.js"></script>
</body>
</html>
所有的css和javascript路径都是我所指的。在基本的文字路线/我的仪表板上,布局和视图显示正确。尽管当你进入片段部分/我的面板/想法时,你会发现404在浏览器控制台中找不到任何东西。
GET http://watch.dev/my-dashboard/skin/default_skin/css/theme.css
GET http://watch.dev/my-dashboard/admin-tools/admin-plugins/admin-panels/adminpanels.css
GET http://watch.dev/my-dashboard/admin-tools/admin-forms/css/admin-forms.css
GET http://watch.dev/my-dashboard/img/avatars/2.jpg
404 (Not Found)
GET http://watch.dev/my-dashboard/js/jquery/jquery-1.11.1.min.js
GET http://watch.dev/my-dashboard/js/bootstrap/holder.min.js
GET http://watch.dev/my-dashboard/components/circles/circles.js
GET http://watch.dev/my-dashboard/components/raphael/raphael.js
GET http://watch.dev/my-dashboard/js/jquery/jquery_ui/jquery-ui.min.js
GET http://watch.dev/my-dashboard/components/highcharts/highcharts.js
GET http://watch.dev/my-dashboard/js/bootstrap/bootstrap.min.js
GET http://watch.dev/my-dashboard/admin-tools/admin-plugins/admin-panels/adminpanels.css
GET http://watch.dev/my-dashboard/admin-tools/admin-forms/css/admin-forms.css
GET http://watch.dev/my-dashboard/img/avatars/2.jpg
404 (Not Found)
GET http://watch.dev/my-dashboard/js/jquery/jquery-1.11.1.min.js
GET http://watch.dev/my-dashboard/js/bootstrap/holder.min.js
GET http://watch.dev/my-dashboard/components/circles/circles.js
GET http://watch.dev/my-dashboard/components/raphael/raphael.js
GET http://watch.dev/my-dashboard/js/jquery/jquery_ui/jquery-ui.min.js
GET http://watch.dev/my-dashboard/components/highcharts/highcharts.js
GET http://watch.dev/my-dashboard/js/bootstrap/bootstrap.min.js
404 (Not Found)
ideas/my-ideas.titch
{% extends "layout/my-dashboard-layout" %}
{% block content %}
{% endblock content %}
感谢您的帮助。404(未找到)
ideas/my-ideas.titch
{% extends "layout/my-dashboard-layout" %}
{% block content %}
{% endblock content %}
感谢您的帮助。
这不是ZF的问题,因为CSS/JS请求甚至不应该接触PHP。因为您在布局中使用的是相对路径,所以浏览器加载的是相对于当前URL的CSS和JS文件。例如,当您在/my-dashboard/ideas
页面上时,它正在尝试加载/my-dashboard/skin/default_skin/css/theme.css
(这不是正确的URL)。
要解决此问题,请始终在布局中使用绝对路径,例如:
<link rel="stylesheet" type="text/css" href="/skin/default_skin/css/theme.css">
(请注意href路径开头的初始斜杠)。这样可以确保您的资产始终从文档根目录加载。
使用这样的basePath视图插件也是一个好习惯:
<link rel="stylesheet" type="text/css" href="<?php echo $this->basePath('css/theme.css'); ?>" />
因此,如果将来你的应用程序的路径会更改,你就不必更改视图文件中所有src和href的路径。