【发布时间】:2017-08-31 08:17:57
【问题描述】:
我正在使用 django 1.10 和 python 3.6 创建一个网站。 我的网络应用程序称为“配置文件”,项目称为“firstsite”。我使用了来自 bootstrap 的模板,该模板保存为“base.html”。我的 webapp 中有两个页面使用模板“home.html”和“about.html”。导航栏是另一个名为“navbar.html”的 html 文件。我正在尝试在导航栏中链接“主页”和“关于”。链接后,当我运行服务器并打开“http://127.0.0.1:8000/”时,出现“NoReverseMatch at/”错误。
-
firstsite/firstsite/urls.py
from django.conf import settings from django.conf.urls.static import static from django.conf.urls import url, include from django.contrib import admin urlpatterns = [ url(r'^admin/', admin.site.urls), url(r'^', include('profiles.urls')), ] if settings.DEBUG: urlpatterns += static(settings.STATIC_URL, document_root=settings.STATIC_ROOT) urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT) -
firstsite/profiles/urls.py
from django.conf.urls import url from profiles import views app_name = 'profiles' urlpatterns = [ url(r'^$', views.home, name='home'), url(r'^about/$', views.about, name='about'), ] -
firstsite/profiles/views.py
from django.shortcuts import render def home(request): context = locals() template = 'home.html' return render(request, template, context) def about(request): context = locals() template = 'about.html' return render(request, template, context) -
firstsite/profiles/templates/base.html
{% load staticfiles %} <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags --> <meta name="description" content=""> <meta name="author" content=""> <link rel="icon" href="../../favicon.ico"> <title>Theme Template for Bootstrap</title> <!-- Bootstrap core CSS --> <link href="{% static 'css/bootstrap.min.css' %}" rel="stylesheet"> <!-- Bootstrap theme --> <link href="{% static 'css/bootstrap-theme.min.css' %}" rel="stylesheet"> <!-- IE10 viewport hack for Surface/desktop Windows 8 bug --> <link href="../../assets/css/ie10-viewport-bug-workaround.css" rel="stylesheet"> <!-- Custom styles for this template --> <link href="{% static 'css/theme.css' %}" rel="stylesheet"> <link rel='stylesheet' href='{% static "css/main.css" %}'> <!-- Just for debugging purposes. Don't actually copy these 2 lines! --> <!--[if lt IE 9]><script src="../../assets/js/ie8-responsive-file-warning.js"></script><![endif]--> <script src="../../assets/js/ie-emulation-modes-warning.js"></script> <![endif]--> </head> <body> {% include 'navbar.html'%} <div class="container theme-showcase" role="main"> {% block content %} {% endblock %} <!-- Main jumbotron for a primary marketing message or call to action --> <div class="jumbotron"> <h1>Theme example</h1> <p>This is a template showcasing the optional theme stylesheet included in Bootstrap. Use it as a starting point to create something more unique by building on or modifying it.</p> </div> </div> <!-- /container --> <!-- Bootstrap core JavaScript ================================================== --> <!-- Placed at the end of the document so the pages load faster --> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <script>window.jQuery || document.write('<script src="../../assets/js/vendor/jquery.min.js"><\/script>')</script> <script src="{% static 'javascript/bootstrap.min.js' %}"></script> <script src="{% static 'javascript/docs.min.js' %}"></script> <!-- IE10 viewport hack for Surface/desktop Windows 8 bug --> <script src="../../assets/js/ie10-viewport-bug-workaround.js"></script> </body> </html> -
firstsite/profiles/templates/home.html
{% extends 'base.html' %} {% block content %} <h1>Hello World. I'm Back.</h1> {% endblock %} -
firstsite/profiles/templates/about.html
{% extends 'base.html' %} {% block content %} <h1>Hello About</h1> {% endblock %} -
firstsite/profiles/templates/navbar.html
<!-- Fixed navbar --> <nav class="navbar navbar-default navbar-fixed-top"> <div class="container"> <div class="navbar-header"> <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a class="navbar-brand" href="#">Bootstrap theme</a> </div> <div id="navbar" class="navbar-collapse collapse"> <ul class="nav navbar-nav"> <li class="active"><a href="{% url 'home' %}">Home</a></li> <li><a href="{% url 'about' %}">About</a></li> <li><a href="#contact">Contact</a></li> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Dropdown <span class="caret"></span></a> <ul class="dropdown-menu"> <li><a href="#">Action</a></li> <li><a href="#">Another action</a></li> <li><a href="#">Something else here</a></li> <li role="separator" class="divider"></li> <li class="dropdown-header">Nav header</li> <li><a href="#">Separated link</a></li> <li><a href="#">One more separated link</a></li> </ul> </li> </ul> </div><!--/.nav-collapse --> </div> </nav>
正如您在 navbar.html 中看到的,{% url 'home' %} 应该可以工作,但我收到此错误:
如果我在 navbar.html 中删除 {% url 'home' %} 并放置 #,则网站可以正常运行,没有任何错误。
【问题讨论】:
标签: python html django twitter-bootstrap navbar