質問編集履歴
3
エラー内容の追加
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -148,8 +148,18 @@
|
|
|
148
148
|
Sample
|
|
149
149
|
}
|
|
150
150
|
})
|
|
151
|
+
|
|
152
|
+
vueApp.$mount(#app)
|
|
151
153
|
```
|
|
152
154
|
|
|
155
|
+
#### エラー内容
|
|
156
|
+
ブラウザ上で下記のような表示が出力されます。
|
|
157
|
+
```
|
|
158
|
+
<!--function (a, b, c, d) {
|
|
159
|
+
return createElement(vm, a, b, c, d, true);
|
|
160
|
+
}-->
|
|
161
|
+
```
|
|
162
|
+
|
|
153
163
|
以下のリンクのように読み込みたいです。
|
|
154
164
|
[vue.jsのDjangoでの使い所](https://qiita.com/gsk3beta/items/2c237d1434b06e9ebf8b)
|
|
155
165
|
|
2
追記部分のmain.jsの修正
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -142,7 +142,7 @@
|
|
|
142
142
|
|
|
143
143
|
```javascript
|
|
144
144
|
// main.js
|
|
145
|
-
new Vue({
|
|
145
|
+
var vueApp = new Vue({
|
|
146
146
|
el: '#app',
|
|
147
147
|
components: {
|
|
148
148
|
Sample
|
1
コンポーネントを一つ渡してみた場合の追記
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -118,4 +118,39 @@
|
|
|
118
118
|
- vue/cli 4.2.3
|
|
119
119
|
- Vuetify 2.2.11
|
|
120
120
|
|
|
121
|
+
### 追記:2020/04/03
|
|
122
|
+
試しに下記のようにVueコンポーネントを一つDjangoテンプレートに渡してみたところ、うまくいきませんでした。
|
|
123
|
+
Djangoテンプレートに下記のような方法で渡すのは難しいのでしょうか？
|
|
124
|
+
|
|
125
|
+
```html
|
|
126
|
+
{% load render_bundle from webpack_loader %}
|
|
127
|
+
<!DOCTYPE html>
|
|
128
|
+
<html>
|
|
129
|
+
<head>
|
|
130
|
+
<meta charset="UTF-8">
|
|
131
|
+
<title>Sapmle Page</title>
|
|
132
|
+
</head>
|
|
133
|
+
|
|
134
|
+
<body>
|
|
135
|
+
<div id="app">
|
|
136
|
+
<sample/>
|
|
137
|
+
</div>
|
|
138
|
+
{% render_bundle 'app' %}
|
|
139
|
+
</body>
|
|
140
|
+
</html>
|
|
141
|
+
```
|
|
142
|
+
|
|
143
|
+
```javascript
|
|
144
|
+
// main.js
|
|
145
|
+
new Vue({
|
|
146
|
+
el: '#app',
|
|
147
|
+
components: {
|
|
148
|
+
Sample
|
|
149
|
+
}
|
|
150
|
+
})
|
|
151
|
+
```
|
|
152
|
+
|
|
153
|
+
以下のリンクのように読み込みたいです。
|
|
154
|
+
[vue.jsのDjangoでの使い所](https://qiita.com/gsk3beta/items/2c237d1434b06e9ebf8b)
|
|
155
|
+
|
|
121
156
|
以上、拙い文章ではございますが、どなたかご教授頂けると幸いです。
|