demo 原始链接:https://vux.li/demos/v2/#/component/x-table
\n下面的$t是Demo的i18n使用的翻译函数,一般情况下可以直接使用字符串。另外,下面代码隐藏了i18n标签部分的代码。
\n<template>\n <div>\n <load-more tip=\"default\" :show-loading=\"false\" background-color=\"#fbf9fe\"></load-more>\n <div style=\"padding:0 15px;\">\n <x-table>\n <thead>\n <tr>\n <th>Product</th>\n <th>Price</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>Apple</td>\n <td>$1.25</td>\n </tr>\n <tr>\n <td>Banana</td>\n <td>$1.20</td>\n </tr>\n </tbody>\n </x-table>\n </div>\n <div>\n <load-more tip=\"cell-bordered=false\" :show-loading=\"false\" background-color=\"#fbf9fe\"></load-more>\n <x-table :cell-bordered=\"false\" style=\"background-color:#fff;\">\n <thead>\n <tr>\n <th>Product</th>\n <th>Price</th>\n <th>Quantity</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>Apple</td>\n <td>$1.25</td>\n <td> x 1</td>\n </tr>\n <tr>\n <td>Banana</td>\n <td>$1.20</td>\n <td> x 2</td>\n </tr>\n </tbody>\n </x-table>\n\n <load-more tip=\"content-bordered=false\" :show-loading=\"false\" background-color=\"#fbf9fe\"></load-more>\n\n <x-table :cell-bordered=\"false\" :content-bordered=\"false\" style=\"background-color:#fff;\">\n <thead>\n <tr style=\"background-color: #F7F7F7\">\n <th>Product</th>\n <th>Price</th>\n <th>Quantity</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>Apple</td>\n <td>$1.25</td>\n <td> x 1</td>\n </tr>\n <tr>\n <td>Banana</td>\n <td>$1.20</td>\n <td> x 2</td>\n </tr>\n </tbody>\n </x-table>\n </div>\n <div style=\"padding:15px;\">\n <load-more tip=\"full-bordered\" :show-loading=\"false\" background-color=\"#fbf9fe\"></load-more>\n <x-table full-bordered style=\"background-color:#fff;\">\n <thead>\n <tr>\n <th>Product</th>\n <th>Price</th>\n <th>Quantity</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>Apple</td>\n <td colspan=\"2\">$1.25 x 10</td>\n </tr>\n <tr>\n <td>Banana</td>\n <td>$1.20</td>\n <td>x 08</td>\n </tr>\n </tbody>\n </x-table>\n </div>\n </div>\n</template>\n\n<script>\nimport { XTable, LoadMore } from 'vux'\n\nexport default {\n components: {\n XTable,\n LoadMore\n }\n}\n</script>\n
\n