html - 如何在 Vuetify.js 中使文本换行到下一行

Question

我正在尝试将一大块文本添加到 HTML 元素，但文本都保持一行，离开屏幕的右侧，而不是换行到多行。不确定这是常规的 HTML/CSS 问题还是 Vuetify 问题。

<v-flex>
    <v-card>
        <v-container>
            <p>
                 {{ stringToDisplay }}
            </p>
        <v-container>
    </v-card>
</v-flex>

Answer 1

您可以使用 text-wrap/text-no-wrap类(class)。
像下面这样:

<v-flex>
    <v-card>
        <v-container>
            <p class="text-wrap">
                 {{ stringToDisplay }}
            </p>
        <v-container>
    </v-card>
</v-flex>