JS 未向表中添加行

Question

我找出了表格中的值。那是对的。它以字符串形式返回。

const saveList = () => {
    const inputListNameText = inputListName.value;

    fetch('/api/lists', {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json',
        },
        body: JSON.stringify({ list_name: inputListNameText }),
    }).then(response => response.json())
        .then(data => {
            console.log(data);
            console.log(inputListNameText);

            const tableBody = document.querySelector('#tbody');
            const newRow = document.createElement('tr');
            const listCell = document.createElement('td');

            listCell.textContent = inputListNameText.value;
            newRow.appendChild(listCell);
            tableBody.appendChild(newRow);
        })
}

<table class="table table-striped table-sm table-bordered">
                                <thead class="thead-dark">
                                    <tr>
                                        <th scope="col">Task</th>
                                    </tr>
                                </thead>
                                <tbody id="tbody">
                                    <tr id="list-container">
                                        <th scope="row"><input class="todo__checkbox" type="checkbox"></th>
                                        <td class="text-break"></td>
                                    </tr>
                                </tbody>
                            </table>

我确保数据正确传输。

Answer 1

正如我在图像中看到的，该行已添加，但文本内容似乎为空。

你可以尝试改变

listCell.textContent = inputListNameText.value;

与

listCell.textContent = inputListNameText;