vue 加入对比 3种方法

最新推荐文章于 2024-07-25 15:19:10 发布

jooner888

最新推荐文章于 2024-07-25 15:19:10 发布

阅读量1k

点赞数

分类专栏： vue 文章标签： vue.js javascript

本文链接：https://blog.csdn.net/zhuwang219/article/details/121859285

版权

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset = "UTF-8">
<title>加入对比测试</title>
<style>
[v-cloak]{display: none;}
a{text-decoration: none;color:#00f}
.center{text-align: center;}
.disabled{cursor:not-allowed;color:#999;pointer-events: none;}
</style>
</head>
<body>
<div id="app" v-cloak>
  <table border="1" align=center cellspacing="0" width="500">
    <caption align="center"><b>规格设置</b></caption>
    <tr>
      <th>名称</th>
      <th>价格</th>
      <th>操作</th>
    </tr>
    <template v-if="lists && lists.length>0">
      <tr v-for="(item,index) in lists" :key="item.id">
        <td>{
  {item.name}}</td>
        <td>{
  {item.price}}</td>
        <td class="center"><a href="javascript:;" @click="addCompare(index,item)">加入对比>></a></td>
      </tr>
    </template>
    <tr v-if="lists.length==0"><td colspan="3" class="center">暂无记录</td></tr>
  <