【问题标题】:How to use Masonry grid layout in vuejs2(with bootstrap) without jquery?如何在没有 jquery 的 vuejs2(带引导程序)中使用砌体网格布局?
【发布时间】:2018-03-16 10:06:13
【问题描述】:

我想在我的页面中显示类似card-columns 的推文。

我无法在我的 vue webpack 模板中使用 Masonry。我已经通过 npm 和 CDN 尝试过,但没有正确获取网格。

在 main.js 中

import Tweet from 'vue-tweet-embed';
import Masonry from 'masonry-layout';

在html中

<head>
//....
<script src="https://unpkg.com/masonry-layout@4/dist/masonry.pkgd.min.js"></script>
</head>

在模板中

<div class="grid">
    <div class="grid-item" v-for="i in topics">
        <Tweet class="" :id="i.tweets.quoted_status_id_str" :options="{ theme: 'light' }" error-message-class="text-center text-muted tweet_err"><div class="text-center text-muted card" style="margin-top:12px;min-width:30px;"><i class="ion-social-twitter"></i>Loading tweet...</div></Tweet>
    </div>
</div>

【问题讨论】:

    标签: vuejs2 bootstrap-4 masonry tweets


    【解决方案1】:

    我用过vue-masonry

    (我们需要注意重绘方法 this.$redrawVueMasonry(); 在更新或更改时。)

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2014-06-14
      • 1970-01-01
      • 2013-03-20
      • 2018-07-06
      相关资源
      最近更新 更多