表的内容使用MaterializeCSS从卡中取出

晚安

有人知道如何使用带有ECSS的卡片中的表格将内容保存在卡片中吗

我正在使用VUE y MaterializeCSS，但是没有VUE它是相同的

显然，响应表不与卡通信

这是我的代码：

<div>
    <h3>Artículos</h3>
      <div class="row">
        <div class="col s12 m12 xl12">
            <div v-if="loading" class="center-align">
                <div class="progress center-align">
                    <div class="indeterminate"></div>
                </div>
            </div>
        <div class="card">
            <div v-if="!loading" class="card-content black-text">
                    <span class="card-title">
                        Lista de Artículos <a class="waves-effect waves-teal btn-flat"><i class="material-icons">playlist_add</i></a>
                    <div class="input-field" style="font-weight: normal;">
                        <input placeholder="Buscar" id="first_name" type="text" class="validate"
                            v-model="search"
                            @keyup="get(1,search)">
                    </div>
                    </span>

                  <table class="highlight centered responsive-table">
                    <thead style="color: #5d5d5d; font-size: 13px;">
                        <tr>
                            <th>Código</th>
                            <th>Nombre</th>
                            <th>Presentación</th>
                            <th>Opciones</th>
                        </tr>
                    </thead>

                  <tbody>
                      <tr v-for="article in arrayArticles" :key="article.id">
                          <td v-text="article.code"></td>
                          <td v-text="article.name"></td>
                          <td v-text="article.presentation"></td>
                          <td v-text="article.description"></td>
                          <td v-text="article.category.name"></td>
                          <td v-text="article.minimum_stock"></td>
                          <td v-if="article.current_stock >= article.minimum_stock">
                              <span class="badge green" style="color: white">{{article.current_stock}}</span>
                          </td>
                          <td v-else>
                              <span class="badge red" style="color: white">{{article.current_stock}}</span>
                          </td>
                          <td>${{article.purchace_price}}</td>
                          <td>${{article.sale_price}}</td>
                          <td>${{article.sale_price - article.purchace_price}}</td>
                          <td>
                            <div v-if="article.condition">
                              <span class="badge green" data-badge-caption="Inactivo" style="color: white"></span>
                            </div>
                            <div v-else>
                              <span class="badge blue-grey lighten-3" data-badge-caption="Inactivo" style="color: white"></span>
                            </div>
                          </td>
                          <td class="center-align">
                                <i class="material-icons" style="margin-left: 2px; color:#ffc107; cursor:pointer;"
                                @click="getById(article), fillSelectCategories()">edit</i>
                                <i style="margin-left: 5px; color:#ff6f00; cursor:pointer;" class="material-icons"
                                @click="deativate(article.id)">clear</i>
                          </td>
                      </tr>
                  </tbody>
                </table>
            </div>
          </div>
        </div>
    </div>
</div>

阿蒂库罗斯
艺术列表
尝试以下方法：


.table响应{
显示：块；
宽度：100%；
溢出-x：自动；
-webkit溢出滚动：触摸；
-ms溢出样式：-ms自动隐藏滚动条；
}

卡片标题
身份证件
名称
项目名称
项目说明
项目数量
项目价格
全部的
11232132131
阿尔文
埃克莱尔
巧克力
5.
$1.00
$5.00
24646546464
艾伦
水母
巧克力
7.
$5.00
$35.00
36798799797
乔纳森
棒棒糖
巧克力
5.
$8.00
$40.00
@Saurabh Mistry也许你能帮我。看看这个：