如何在Django中創(chuàng)建一個簡單的計算器應用程序
在本教程中,我將逐步指導您使用 django 創(chuàng)建計算器應用程序。
這是一個適合初學者的教程,因此如果您是 Django 新手,可以繼續(xù)學習。
(更|多優(yōu)質(zhì)內(nèi)|容:java567 點 c0m)
我們的計算器應用程序會是什么樣子?
具有加、減、乘、除運算的計算器
您可以在此GitHub:/SampurnaC/calculator 存儲庫中獲取完整代碼。
如何設置 Django 計算器項目
假設您的系統(tǒng)上安裝了 Django,我們現(xiàn)在將致力于創(chuàng)建項目。為此,您需要打開終端并使用以下命令:
?django-admin startproject calculator
此命令創(chuàng)建項目默認結(jié)構manage.py,其中包含 、 等文件,以及一個項目名稱為包含settings.py、urls.py等文件的文件夾。我們將在開發(fā)應用程序時瀏覽這些文件。
項目創(chuàng)建完成后,我們需要將工作目錄更改為項目目錄。在 Linux 中,命令是cd calculator/.
下一步是創(chuàng)建一個calculatorapp使用以下命令命名的 Django 應用程序:
?python manage.py startapp calculatorapp
models.py該應用程序包含、views,py、admin.py、migrations等文件。
創(chuàng)建應用程序后,第一件重要的事情是將應用程序注冊到文件INSTALLED_APPS列表中settings.py。
為此,您需要導航到settings.pyDjango 項目內(nèi)的文件,即calculator本教程中的文件。該settings.py文件包含INSTALLED_APPS列表,您需要將應用程序名稱添加到列表中。因此,該INSTALLED_APPS列表應如下所示:
?INSTALLED_APPS = [
? ? ?'calculatorapp',
? ? ?'django.contrib.admin',
? ? ?'django.contrib.auth',
? ? ?'django.contrib.contenttypes',
? ? ?'django.contrib.sessions',
? ? ?'django.contrib.messages',
? ? ?'django.contrib.staticfiles',
?]
現(xiàn)在應用程序已注冊,我們已準備好處理該項目。
如何添加路線
現(xiàn)在,讓我們開始添加路線。您需要urls.py在目錄中創(chuàng)建一個文件calculatorapp。添加代碼如下:
?from django.urls import path
?from . import views
?
?urlpatterns = [
? ? ?path('', views.home, name='home'),
?]
在這里,您需要先導入pathfrom django.urls,然后再導入views。
在urlpatterns列表中,您需要傳遞您的視圖函數(shù),我們將很快創(chuàng)建該函數(shù)。
但首先,讓我們將此應用程序 URL 文件注冊到項目urls.py文件中。
因此,您需要打開urls.py計算器目錄中的文件并添加以下代碼:
?from django.contrib import admin
?from django.urls import path, include
?
?urlpatterns = [
? ? ?path('admin/', admin.site.urls),
? ? ?path('', include('calculatorapp.urls')),
?]
這里,它包括 的 URL calculatorapp。如果您想為您的 添加任何新的 URL calculatorapp,您可以從文件中執(zhí)行此操作calculatorapp/urls.py。
如何編寫視圖
現(xiàn)在,如果您嘗試訪問localhost:8000/URL,您將收到錯誤,因為它正在尋找home視圖函數(shù)。/路線的視圖函數(shù)是home,由于沒有home視圖,因此會出錯。
訪問根頁面時終端出錯
在 Django 中,有兩種類型的視圖:基于函數(shù)的視圖和基于類的視圖。在本教程中,我們將使用基于函數(shù)的視圖,它們以def關鍵字開頭。
要修復上述錯誤,您需要轉(zhuǎn)到views.py其中的文件calculatorapp并創(chuàng)建一個home視圖函數(shù)。
?def home(request):
? ? ?pass
如何將模板添加到應用程序
現(xiàn)在,如果您嘗試訪問該localhost:8000/URL,您將收到不同的錯誤。正如您從下面的屏幕截圖中看到的,它正在尋找一些響應來返回。
瀏覽器查找視圖響應時出錯
pass因此,您需要渲染 HTML 模板,而不是像使用隨機文本那樣。模板用于呈現(xiàn)動態(tài) HTML 內(nèi)容。
?def home(request):
? ? ?return render(request, 'home.html')
正如您在視圖中看到的home,它返回home.html模板。
現(xiàn)在,您需要在應用程序的根目錄中創(chuàng)建一個模板文件夾,這calculatorapp在本教程中。
在此模板文件夾中,您需要創(chuàng)建一個home.html文件。
該home.html模板將包含帶有不同計算器按鈕的表單。
將home.html包含以下代碼:
?<div class="center">
?<h1>Basic Calculator</h1>
?
?<form action="result">
? ? ?<input type="number" name="number1" placeholder="Enter first number">
? ? ?<br>
? ? ?<br>
? ? ?<input type="number" name="number2" placeholder="Enter second number">
? ? ?<br>
? ? ?<br>
? ? ?<button type="submit" name="add">Add</button>
? ? ?<button type="submit" name="subtract">Subtract</button>
? ? ?<button type="submit" name="multiply">Multiply</button>
? ? ?<button type="submit" name="divide">Divide</button>
?
?</form>
?</div>
?
?<style>
? ?.center {
? ? ?margin: auto;
? ? ?width: 60%;
? ? ?border: 3px solid #a5addb;
? ? ?padding: 10px;
? ?}
?</style>
上面的代碼包含一個HTML帶有兩個輸入字段和四個按鈕的簡單表單。有一些樣式可以在中心顯示代碼并帶有一些邊框。
上面代碼中需要注意的重要一點是<form action="result">,這意味著在提交表單時它將重定向到resultURL。
現(xiàn)在,如果您嘗試在瀏覽器中執(zhí)行任何操作,您將收到一個新錯誤,因為沒有結(jié)果頁面。
由于沒有結(jié)果頁面,按鈕提交后拋出錯誤
如何添加結(jié)果頁面的 URL
提交表單后,它正在尋找result path. 因此,下一步是創(chuàng)建視圖result并為其添加模板和 URL。
更新后的urls.py文件如下:
?from django.urls import path
?from . import views
?
?urlpatterns = [
? ? ?path('', views.home, name='home'),
? ? ?path('result/', views.result, name='result'),
?
?]
如何為結(jié)果視圖添加模板代碼
列表中的第二個 URLurlpatterns正在查找視圖result。那么,我們現(xiàn)在就開始吧。首先,我將向您展示視圖的代碼result,然后解釋每一行的作用。
?def result(request):
? ? ?num1 = int(request.GET.get('number1'))
? ? ?num2 = int(request.GET.get('number2'))
?
? ? ?
? ? ?if request.GET.get('add') == "":
? ? ? ? ?ans = num1 + num2
?
? ? ?elif request.GET.get('subtract') == "": ? ?
? ? ? ? ?ans = num1 - num2
?
? ? ?elif request.GET.get('multiply') == "": ? ?
? ? ? ? ?ans = num1 * num2
?
? ? ?else:
? ? ? ? ?ans = num1 / num2
?
? ? ?return render(request, 'result.html', {'ans': ans})
現(xiàn)在,我們來分解一下上面的代碼:
它從表單中獲取的值number1和number2輸入字段中獲取值。
然后它根據(jù)單擊的按鈕檢查條件。
由于所有按鈕都有不同的名稱,單擊這些按鈕會在 URL 中提供空字符串值。并在此基礎上添加add、subtract、multiply和 的條件divide。
result.html它使用上下文呈現(xiàn)模板ans。Django 中的上下文是一個字典,其中包含可以傳遞給模板的鍵值對。
現(xiàn)在,您需要在文件夾result.html內(nèi)創(chuàng)建一個文件templates并添加以下代碼:
?<div class="center">
?The result is:
?<h1>{{ans}}</h1>
?
?<a href="{% url 'home' %}">Go Back</a>
?</div>
?<style>
? ?.center {
? ? ?margin: auto;
? ? ?width: 60%;
? ? ?border: 3px solid #a5addb;
? ? ?padding: 10px;
? ?}
?</style>
在這里,它顯示 的值ans。它還包含home具有頁面一些基本樣式的 URL。
在 Django 中,雙大括號{{}}用于顯示變量的值。變量輸出上下文中的值。
最后,我們完成了在 Django 中創(chuàng)建一個具有加法、減法、乘法和除法等基本功能的計算器應用程序。
結(jié)論
這是在 Django 中創(chuàng)建基本計算器應用程序的方法。
在本教程中,您了解了如何處理視圖、模板、URL 以及使 Django 應用程序正常運行所需的配置。
我在這篇文章中沒有討論任何有關模型的內(nèi)容。因此,如果您想將記錄保存在數(shù)據(jù)庫中,您可以進一步嘗試。
我希望您覺得本教程有用。