技術標籤：vuedjango

Django的MTV專案在不使用腳手架的情況下使用Vue

前後端分離的Django專案是可以直接匯入Vue的，不做重複，但是要求在MTV的開發方式中將Vue匯入專案中，將後端拿到的資料統一傳入vue控制元件中，渲染至前端頁面，而不使用Django自帶的模板渲染。

模板頁的目錄結構

這是我的目錄結構，作為初學者可能沒有做到很規範。

檢視函式

def show_practice(request: HttpRequest) -> HttpResponse:
    queryset = Practice.objects.all()
    data = serializers.
 
serialize('json', queryset)
    return render(request, 'test1.html', {'practice': data})

匯入vue用來獲取資料

<script>
		var test = new Vue({
    		el: '#app',
    		data: {
        		message: {{practice | safe}}
    		}
    	})
	</script>

通過這樣的方式就可以拿到資料了。