실행이 안되는데 이유를 몰겠어여
178
작성한 질문수 162
html 출력이 잘안되서여 vue를 잘못부른건지 태그가 잘못된건지 알려주시면 감사여
코드는
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Vue-Django ToDo App</title>
<style>
body {
text-align: center;
background-color: #ddd;
}
.inputBox {
margin: auto;
width: 70%;
background: white;
height: 50px;
border-radius: 50px;
line-height: 50px;
}
.inputBox .name {
border-style: none;
border-bottom: 1px solid #ddd;
width: 70px;
padding-left: 20px;
}
.inputBox .item {
border-style: none;
border-bottom: 1px solid #ddd;
width: 400px;
margin-left: 50px;
padding-left: 20px;
}
.todoList {
list-style: none;
padding: 10px 0;
text-align: left;
}
.todoList li {
display: flex;
height: 50px;
line-height: 50px;
margin: 0.5rem 0;
padding: 0 0.9rem;
background: white;
border-radius: 5px;
}
.removeBtn {
margin-left: auto;
font-size: 20px;
}
</style>
</head>
<body>
<div id="app">
<h1>My Todo App !</h1>
<strong>서로 할 일이나 의견을 공유해 봅시다.</strong>
<br>
<div class="inputBox">
<input class="name" type="text" placeholder="name ...">
<input class="item" type="text" placeholder="type anything welcomed ...">
<button>ADD</button>
</div>
<ul class="todoList">
<li v-for="todo in todoItems">
<span> {{todo.name}} :: {{todo.item}}</span>
<span class="removeBtn">×</span>
</li>
</ul>
</div>
<script src="https://unpkg.com/vue/dist/vue.min.js"></script>
<script>
var vm = new Vue({
el: '#app',
data: {
todoItems:[
{name:'김석훈', item:'django와 vue js'},
{name:'김석현', item:'django와 react'},
{name:'김석진', item:'django와 bootstrap'},
{name:'김석민', item:'django와 css'},
],
},
methods:{},
}),
</script>
</body>
</html>
답변 1
0
독자님. 이제사 보았네요. 미안합니다.
new Vue({ ... }),
문법 에러입니다. 위 코드에서 마지막 콤마를 지워 보세요.
해결 안되면 다시 알려주세요. 감사합니다.
들여쓰기 단축키가 어떻게 되나요?
0
253
1
mixin 에러가 나서 실행이 안되요.
0
420
4
화면 에러화면이 자꾸 뜨네요..
0
418
4
todo_form.html 하단에 todo_List.html의 리스트가 오게 하고 싶습니다.
0
353
1
bootodo.html에서 Vue 코드가 적용되지 않습니다.
0
577
1
cdn vue버전
3
720
2
bootstrap 팝업창 만들기 단원에서 질문있습니다.
0
921
3
MultipleObjectMixin get 메소드 상속
0
253
1
Vue에서 파일 업로드시
0
718
1
vue django 연동 질문
0
501
1
장고 프론트엔드 백엔드 분리 관련 질문입니다 !
0
491
1
home화면에서 이미지가 안보입니다.
0
293
2
이 강의와 새로 만드신 강의의 차이점을 알고 싶습니다.
0
301
1
좋은 강의 감사합니다.
0
249
1
staticfiles가 static으로 바뀌었습니다.
0
278
1
장고 3.1에서 다음과 같이 바뀌었습니다.
0
293
2
Vuejs 와 Reactjs의 차이
0
356
1
vue js 오픈소스 연동
0
495
2
createView에서 success_url
0
252
1
강의자료 HtmlTodo.zip 파일 구글드라이브에서 바이러스로 인식해서 다운로드 안됩니다.
1
269
2
object에 왜 todo 컬럼이 추가되는지?
0
209
2
django_only 실습중 에러 제보
0
279
3
BaseListView
1
276
1
todo_confirm_delete.html
1
345
1