리스트의 순서

Question

input에 할일을 추가하면 밑에 안쌓이고 순서가 왜 뒤죽박죽이 되나요?? 어떻게 넣는 순서대로 밑에 쌓이도록 하나요?

MIKE.aeon · Answer

저도 궁금해서 구글링해서 만들어 봤습니다. 참고하세요,  TodoList.vue에서, methods 에 아래 함수 추가하시고 create/for문 다음에 한줄 추가하면 될것 같습니다. 함수는 인터넷에 있는거 복사해서 구현했습니다.   methods: {      sortObj :  function (   a ,  b   ) { <====== 추가        if  (  a . item   <   b . item  ){          return   - 1 ;       }        if  (  a . item   >   b . item  ){          return   1 ;       }        return   0 ;    }, ------------------------------------------------        for  ( var   i = 0 ;  i < localStorage . length ;  i ++ ){          if ( localStorage . key ( i )  !=   ' loglevel:webpack-dev-server ' ) {            this . todoItems . push (  JSON . parse ( localStorage . getItem ( localStorage . key ( i ))) );         }       }        this . todoItems . sort ( this . sortObj ); <====== 추가

캡틴판교 · Answer

안녕하세요 도현님, 답변이 늦었네요..! :) 추가 했을 때 순서가 보장되지 않는 이유는 로컬 스토리지에서 꺼내온 리스트를 정렬하지 않고 화면에 뿌리고 있기 때문입니다. 배열의 sort API를 이용해서 한번 정렬해보시면 될 것 같아요 :)