Shulou(Shulou.com)06/01 Report--

This article mainly explains the "HTML case analysis", the content of the article is simple and clear, easy to learn and understand, now please follow the editor's ideas slowly in depth, together to study and learn "HTML case analysis" bar!

Style is the same as before

Ul.item {

List-style-type: disc

Margin-block-start: 0

Margin-block-end: 0

Margin-inline-start: 0

Margin-inline-end: 0

Padding-inline-start: 0

}

.item li {

Height: 50px

Line-height: 50px

Border: 1px solid # aaaaaa

Width: 200px

Padding: 0 10px

Display: flex

Align-items: center

}

Render the DOM first

New Vue ({

El: "# drag"

Data: {

DraggingItem: null

LastItem: null

Items: Array.from ({length: 5}, (_ item, index) = > ({

Key: index + 1 + ""

Name: "Item" + (index + 1)

}))

}

})

Templates are exceptionally simple

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.