Ошибка продолжает сохраняться даже после того, как все вещи четко определены. - PullRequest
0 голосов
/ 03 августа 2020

Эта ошибка повторяется

Uncaught SyntaxError: Неожиданный токен u в JSON в позиции 0 в JSON .parse () в HTMLDocument.getTodos

Я искал, где не определил, но, кажется, обнаружил. Потребуется помощь

Я везде проверял место, которое мне нужно исправить, но не получил


function removeLocalTodos(todo) {
    //CHECK---Hey do I already have things in there?
    let todos;
    if (localStorage.getItem('todos')===null) {
        todos=[];
    }else{
        todos=JSON.parse(localStorage.getItem('todos'));
    }
        
}

Это полный JS код для тщательного анализа

//Selectors
const todoInput=document.querySelector('.todo-input');
const todoButton=document.querySelector('.todo-button');
const todoList=document.querySelector('.todo-list');
const filterOption=document.querySelector('.filter-todo');

//Event Listeners
document.addEventListener('DOMContentLoaded', getTodos);
todoButton.addEventListener('click', addTodo);
todoList.addEventListener('click', deleteCheck);
filterOption.addEventListener('click', filterTodo);

//functions
function addTodo(event) {
    //prevent form from submitting
    event.preventDefault();
    //Todo DIV
    const todoDiv=document.createElement('div');
    todoDiv.classList.add('todo');
    //Creat LI
    const newTodo = document.createElement('li');
    newTodo.innerText=todoInput.value;
    newTodo.classList.add('todo-item');
    todoDiv.appendChild(newTodo);
    //ADD TODO TO LOCALSTORAGE
    saveLocalTodos(todoInput.value);
    //CHECK MARK BUTTON
    const completedButton = document.createElement('button');
    completedButton.innerHTML='<i class="fas fa-check"></i>';
    completedButton.classList.add('complete-btn');
    todoDiv.appendChild(completedButton);

    //CHECK TRASH BUTTON
    const trashButton = document.createElement('button');
    trashButton.innerHTML='<i class="fas fa-trash"></i>';
    trashButton.classList.add('trash-btn');
    todoDiv.appendChild(trashButton);

    //APPEND TO LIST
    todoList.appendChild(todoDiv);

    //Clear Todo INPUT VALUE
    todoInput.value='';
}

function deleteCheck(e) {
    const item=e.target;

    //DELETE TODO
    if (item.classList[0] ==='trash-btn'){
        const todo=item.parentElement;
        //Animation
        todo.classList.add('fall');
        removeLocalTodos(todo);
        todo.addEventListener('transitionend',function (argument) {
            todo.remove();
        } );
    }
    //CHECK MARK
    if (item.classList[0]==='complete-btn') {
        const todo=item.parentElement;
        todo.classList.toggle('completed');
    }

}

function filterTodo(e) {
    const todos = Array.from(todoList.children);
    todos.forEach(function (todo) {
        switch (e.target.value){
            case 'all':
            todo.style.display ='flex';
            break;
        case 'completed':
            if (todo.classList.contains('completed')) {
                todo.style.display ='flex';
            } else {
                todo.style.display ='none';
            }
            break;
            case 'uncompleted':
                if (!todo.classList.contains('completed')) {
                    todo.style.display ='flex';
                    }else {
                        todo.style.display ='none';
                }
                break;
        }
    })
    
}


function saveLocalTodos(todo) {
    //CHECK---Hey do I already have things in there?
    let todos;
    if (localStorage.getItem('todos')===null) {
        todos=[];
    }else{
        todos=JSON.parse(localStorage.getItem('todos'));
    }
    todos.push(todo);
    localStorage.setItem('todos', JSON.stringify(todos));
}
function getTodos() {
    let todos;
    //CHECK---Hey do I already have things in there?
    if (localStorage.getItem('todos')===null) {
        todos=[];
    }else{
        todos=JSON.parse(localStorage.getItem('todos'));
    }

        todos.forEach(function (todo) {
                //Todo DIV
    const todoDiv=document.createElement('div');
    todoDiv.classList.add('todo');
    //Creat LI
    const newTodo = document.createElement('li');
    newTodo.innerText=todo;
    newTodo.classList.add('todo-item');
    todoDiv.appendChild(newTodo);
    
    //CHECK MARK BUTTON
    const completedButton = document.createElement('button');
    completedButton.innerHTML='<i class="fas fa-check"></i>';
    completedButton.classList.add('complete-btn');
    todoDiv.appendChild(completedButton);

    //CHECK TRASH BUTTON
    const trashButton = document.createElement('button');
    trashButton.innerHTML='<i class="fas fa-trash"></i>';
    trashButton.classList.add('trash-btn');
    todoDiv.appendChild(trashButton);

    //APPEND TO LIST
    todoList.appendChild(todoDiv);
        })

}
function removeLocalTodos(todo) {
    //CHECK---Hey do I already have things in there?
    let todos;
    if (localStorage.getItem('todos')===null) {
        todos=[];
    }else{
        todos=JSON.parse(localStorage.getItem('todos'));
    }
    console.log(todo);  
}

<form>
    <input type="text" class="todo-input">
    <button class="todo-button" type="submit"><i class="fas fa-plus-square"></i></button>
    <div class="select">
        <select name="todos" class="filter-todo">
            <option value="all">All</option>
            <option value="completed">Completed</option>
            <option value="uncompleted">Uncompleted</option>
        </select>
    </div>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...