购物车页面:
需求:统计价格,按钮增删,移除,无数据展示购物车为空
ps:该页面为bilibili视频网站截图,粘于此处,奋勉己身
页面html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>书籍购物车</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div id="app">
<div v-if="list.length">
<table>
<thead>
<tr>
<th></th>
<th>书籍名称</th>
<th>出版日期</th>
<th>价格</th>
<th>购买数量</th>
<th>操作</th>
</tr>
</thead>
<tbody>
<tr v-for="(item,index) in list">
<td>{
{item.id}