55,000원
다른 수강생들이 자주 물어보는 질문이 궁금하신가요?
- 미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
깃헙 요청드립니다.
인프런 아이디 : skswngusslab@gmail.com인프런 이메일 : skswngusslab@gmail.com깃헙 아이디: skswngussla@naver.com깃헙 Username : lyd1040
- 미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
왜 저는 todoItem.item 하면 값이 안나오는걸까요?
TodoList.vue코드<template><div><ul><!-- <li v-for="(todoItem, index) in todoItems" v-bind:key="todoItem.item" class="shadow">{{todoItem}}<i class="checkBtn fa-solid fa-check" v-bind:class="{checkBtnCompleted: todoItem.completed}" v-on:click="toggleComplete(todoItem, index)"></i>v-bind:class="{A:a}" A클래스의 a속성이 false면 안나타남, true면 나타남 --><!-- <span v-bind:class="{textCompleted: todoItem.completed}">{{ todoItem.item }}</span><span class="removeBtn" v-on:click="removeTodo(todoItem, index)"><i class="fa-solid fa-trash-can"></i></span></li>> --><li v-for="(todoItem, index) in todoItems" v-bind:key="todoItem" class="shadow"><i class="checkBtn fa-solid fa-check" v-bind:class="{ checkBtnCompleted: todoItem.completed }" v-on:click="toggleComplete(todoItem, index)"></i>{{ todoItem.item }} {{ index }}<!-- //v-bind:class="{A:a}" A클래스의 a속성이 false면 안나타남, true면 나타남 --><span v-bind:class="{ textCompleted: todoItem.completed }">{{ todoItem}}</span><span class="removeBtn" v-on:click="removeTodo"><i class="fa-solid fa-trash-can"></i></span></li></ul></div></template> <script>export default {data: function () {return {todoItems: []}},methods: {removeTodo: function (todoItem, index) {console.log('remove items');console.log(todoItem, index);localStorage.removeItem(todoItem);this.todoItems.splice(index, 1);},toggleComplete: function (todoItem, index) {todoItem.completed = !todoItem.completed;console.log(index);console.log(todoItem.item);//로컬스토리지 갱신localStorage.removeItem(todoItem.item);localStorage.setItem(todoItem.item, JSON.stringify(todoItem));}},created: function () {if (localStorage.length > 0) {for (var i = 0; i < localStorage.length; i++) {if (localStorage.key(i) !== 'loglevel:webpack-dev-server') {console.log(JSON.parse(localStorage.getItem(localStorage.key(i))));this.todoItems.push(localStorage.key(i));}}}}}</script> <style scoped>ul {list-style-type: none;padding-left: 0px;margin-top: 0;text-align: left;}li {display: flex;min-height: 50px;height: 50px;line-height: 50px;margin: 0.5rem 0;padding: 0 0.9rem;background: white;border-radius: 5px;}.removeBtn {margin-left: auto;color: #de4343;}.checkBtn {line-height: 45px;color: #62acde;margin-right: 5px;}.checkBtnCompleted {color: #b3adad;}.textCompleted {text-decoration: line-through;color: #b3adad;}</style> TodoInput.vue코드<template> <div class="inputBox shadow"> <input type= "text" v-model="todoItems" v-on:keyup.enter="addTodo"> <span class="addContainer" v-on:click="addTodo"> <i class="fas fa-plus addBBtn"></i> </span> </div> </template> <script> export default { data: function(){ return{ todoItems: "" } }, methods:{ addTodo: function(){ if(this.todoItems !== ''){ //저장하는 로직 //localStorage.setItem(key, value); //localStorage.setItem(this.newTodoItem, this.newTodoItem); var obj = {completed: false, item: this.todoItems}; //localStorage.setItem(this.newTodoItem,obj); localStorage.setItem(this.todoItems, JSON.stringify(obj)); //obj 객체 > string화 this.clearInput(); } }, clearInput: function(){ this.todoItems = ''; } } } </script> <style scoped> input:focus{ outline: none; } .inputBox { background: white; height: 50px; line-height: 50px; border-radius: 5px; } .inputBox input { border-style: none; font-size: 0.9rem; } .addContainer { float: right; background: linear-gradient(to right, #6478FB, #8763FB); display: block; width: 3rem; border-radius: 0 5px 5px 0; } .addBtn { color: white; vertical-align: middle; } </style>
- 미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
깃허브 권한요청합니다
인프런 아이디 : @tkfkdgoll인프런 이메일 : ttkfkdgolll@naver.com깃헙 아이디 : ttkfkdgolll@naver.com깃헙 Username : ryuwonhui
- 미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
깃헙 권한 요청드립니다.
- 인프런 아이디: secondwarren@gmail.com- 인프런 이메일: secondwarren@gmail.com- 깃허브 아이디: secondwarren@gmail.com- 깃허브 username: weritas247
- 미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
깃헙 요청합니다
깃헙 요청합니다인프런 아이디 : gogyuja@gmail.com인프런 이메일 : gogyuja@gmiail.com 깃헙 아이디 : gogyuja@gmail.com깃헙 Username : good-game-yo
- 미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
깃 허브 권한 요청드립니다.
인프런 아이디 : dongju.shin@wezon.com 인프런 이메일 : dongju.shin@wezon.com 깃헙 아이디 : ehdwn0528@gmail.com 깃헙 Username : dongju.shin
- 미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
깃허브 권한 요청드립니다
인프런 메일 : comur@naver.com인프런 아이디 : comur@naver.com 깃헙 아이디 : comur@naver.com깃헙 Username : comur1
- 미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
깃헙 권한요청 드립니다.
인프런 아이디 : ksr92923@naver.com인프런 이메일 : ksr92923@naver.com깃헙 아이디 : complete9261깃헙 Username : complete9261
- 미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
깃허브 권한 요청드려요.
인프런 아이디 : wish3111@naver.com인프런 이메일 : wish3111@naver.com깃헙 아이디 : wish31깃헙 아이디 : wish31
- 미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
깃헙 권한 요청
인프런 아이디 : suzin.jang@samsung.com인프런 이메일 : suzin.jang@samsung.com깃헙 아이디 : susan3722@snu.ac.kr깃헙 Username : suziinee
- 미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
깃헙 권한 요청드립니다.
인프런 아이디 : bsk.kim@samsung.com인프런 이메일 : bsk.kim@samsung.com깃헙 아이디 : xfrnk2깃헙 Username : xfrnk2
- 미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
깃헙 권한 요청
인프런 아이디 : minsun.yun@samsung.com인프런 이메일 : minsun.yun@samsung.com깃헙 아이디 : miinsun깃헙 Username : miinsun
- 미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
깃헛 권한 요청 드립니다.
인프런 아이디 : mwkang@ecstel.co.kr인프런 이메일 : mwkang@ecstel.co.kr깃헙 아이디 : mwkang@ecstel.co.kr깃헙 Username : goo1949
- 미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
github 접근권한 주세요
인프런 아이디 : illb인프런 이메일 : illb@illb.co.kr깃헙 아이디 : goodmanrabbit@gmail.com깃헙 Username : kangguchul
- 미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
깃헙 권한 요청 드립니다!
인프런 아이디 : skyee23@gmail.com인프런 이메일 : skyee23@gmail.com깃헙 아이디 : skyee23@gmail.com깃헙 Username : xxsank
- 미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
권한요청 드립니다
안녕하세요, 권한 요청드립니다.- 인프런 아이디: tpdud406@gmail.com- 인프런 이메일: tpdud406@gmail.com- 깃허브 아이디: tpdud406@gmail.com- 깃허브 username: tpdud406
- 미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
속성명의 축약 특징 리팩토링에 관한 질문
객체의 속성명과 값이 같으면하나만 쓰면 된다고 하셨는데실무에서 작업하실때 이러한 편리함때문에 변수선언의 설계를일부러 같이 객체의 속성명이랑 값이랑 같이 하는 편인가요?
- 미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
깃헙 권한요청 부탁드립니다.
인프런 아이디 : jongseungim5348@gmail.com인프런 이메일 : jongseungim5348@gmail.com깃헙 아이디 : jongseungim5348@gmail.com깃헙 Username : limjongseung
- 미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
깃헙 권한 요청 드립니다.
권한 요청 드립니다.인프런 아이디 : choigy0331@naver.com인프런 이메일 : choigy0331@naver.com깃헙 아이디 : choigy1001깃헙 Username : Keun young
- 미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
권한요청부탁드립니다.
인프런 아이디 : hskim1559인프런 이메일 : hskim1559@gmail.com깃헙 아이디 : hskim1559@gmail.com깃헙 Username : dalcomz