From the course: Building Interactive UIs with SolidJS: Key Concepts and Features
Join today to access over 24,900 courses taught by industry experts.
Implementing control flow helpers and displaying task items - JavaScript Tutorial
From the course: Building Interactive UIs with SolidJS: Key Concepts and Features
Implementing control flow helpers and displaying task items
- [Instructor] Now that we've set up our state and the method to add new tasks, it's time to move on to displaying them. We'll use the for control helper from SolidJS. Surrender our list of tasks, so far we've been working with hard cadet tasks in our GSX. It's time to replace these with our actual task list. We'll start by taking a moment to examine the current structure of each task. On line 59, we have a button for deletion. We also have a development to display the task text on line 60, along with the styling for completed tasks. We'll use conditional class binding to add these strike three effects to completed tasks. On line 63, we have a checkbox to toggle the tasks completion status. We want to recreate this structure for each item in our task list. This is where we would need the for control flow helper from SolidJS. First, let's import the for helper from SolidJS. At the top of our file back in our JSX we…
Download courses and learn on the go
Watch courses on your mobile device without an internet connection. Download courses using your iOS or Android LinkedIn Learning app.