Enjoy 20% off all plans by following our social accounts!
Check it out
Interviews
Get started
Prepare
价格
Sign in / up
Get full access
Transfer List
框架
React
Angular
Vue
Svelte
作者
Yangshun Tay
Ex-Meta Staff Engineer
Languages
难度
中等
Recommended duration to spend during interviews
30 分钟
Build a component that allows transferring of items between two lists.
Requirements
There are two lists each initially containing 4 items.
Each item has a checkbox that can be checked/unchecked.
Transferring
Clicking on the double arrow buttons will transfer all items from one list to the other, as specified by the direction of the arrows.
Clicking on the single arrow buttons will transfer only the selected items, as specified by the direction of the arrows.
Transferred items are added to the bottom of the destination list.
Item selection (checked) states are preserved after transferring.
Buttons are disabled if there are no relevant items to be transferred.
Preview what you need to build
View solution
Click to go back
Click to go forward
Refresh preview
Mark complete
Save to cloud
Description
Solution
Saved code
Transfer List
框架
React
Angular
Vue
Svelte
作者
Yangshun Tay
Ex-Meta Staff Engineer
Languages
难度
中等
Recommended duration to spend during interviews
30 分钟
Build a component that allows transferring of items between two lists.
Requirements
There are two lists each initially containing 4 items.
Each item has a checkbox that can be checked/unchecked.
Transferring
Clicking on the double arrow buttons will transfer all items from one list to the other, as specified by the direction of the arrows.
Clicking on the single arrow buttons will transfer only the selected items, as specified by the direction of the arrows.
Transferred items are added to the bottom of the destination list.
Item selection (checked) states are preserved after transferring.
Buttons are disabled if there are no relevant items to be transferred.
Preview what you need to build
接下来试试这些题目
Transfer List II
难度
困难
相似题目
Todo List
难度
中等
Solution
View the full solution on a new page
Go to solution
You must be signed in to view your saved versions
File explorer
App.js
styles.css
public
index.html
src
App.js
index.js
styles.css
package.json
For now, files cannot be created or renamed. It's acceptable to write multiple components within a single file during interviews.
主题
Active4D
All Hallows Eve
Amy
Birds of Paradise
Blackboard
Brilliance Black
Brilliance Dull
Chrome DevTools
Clouds Midnight
Clouds
Cobalt
Cobalt2
Dawn
Dracula
Dreamweaver
Eiffel
Espresso Libre
GitHub Dark
GitHub Light
GitHub
IDLE
Katzenmilch
Kuroir Theme
LAZY
MagicWB (Amiga)
Merbivore Soft
Merbivore
Monokai Bright
Monokai
Night Owl
Nord
Oceanic Next
Pastels on Dark
Slush and Poppies
Solarized-dark
Solarized-light
SpaceCadet
Sunburst
Textmate (Mac Classic)
Tomorrow-Night-Blue
Tomorrow-Night-Bright
Tomorrow-Night-Eighties
Tomorrow-Night
Tomorrow
Twilight
Upstream Sunburst
Vibrant Ink
Xcode_default
Zenburnesque
iPlastic
idleFingers
krTheme
monoindustrial
Loading editor
主题
Active4D
All Hallows Eve
Amy
Birds of Paradise
Blackboard
Brilliance Black
Brilliance Dull
Chrome DevTools
Clouds Midnight
Clouds
Cobalt
Cobalt2
Dawn
Dracula
Dreamweaver
Eiffel
Espresso Libre
GitHub Dark
GitHub Light
GitHub
IDLE
Katzenmilch
Kuroir Theme
LAZY
MagicWB (Amiga)
Merbivore Soft
Merbivore
Monokai Bright
Monokai
Night Owl
Nord
Oceanic Next
Pastels on Dark
Slush and Poppies
Solarized-dark
Solarized-light
SpaceCadet
Sunburst
Textmate (Mac Classic)
Tomorrow-Night-Blue
Tomorrow-Night-Bright
Tomorrow-Night-Eighties
Tomorrow-Night
Tomorrow
Twilight
Upstream Sunburst
Vibrant Ink
Xcode_default
Zenburnesque
iPlastic
idleFingers
krTheme
monoindustrial
Loading editor
Browser
Console
Click to go back
Click to go forward
Refresh preview
过滤日志
按日志级别筛选
所有日志级别
信息
警告
错误
JavaScript Console
console.log()
语句将显示在此处。
Mark complete
Save to cloud