Question

我正在使用Form Generator，我想有条件地以代码语法显示属性。为此，我使用了<pre>标签。

我有条件地显示属性，并且如果什么都没有（空），我想什么也不显示，但是pre标签代替了空白行。

我正在使用Vue模板样式

我的代码

<pre class="CodeBackground">&lt;template&gt;
    &lt;v-form ref=&quot;Form&quot;&gt; 
        &lt;v-container class=&quot;text-center&quot;&gt;<span v-for="(Field, index) in Fields" :key="index">
            {{Field.Type === 'TextField' ? "&lt;v-text-field " : ''}}
                {{FormSettings.Dense === true ? 'dense' : null}}
                {{FormSettings.InputStyle === 'Filled' ? 'filled' : null}}{{FormSettings.InputStyle === 'Solo' ? 'solo' : null}}{{FormSettings.InputStyle === 'Outlined' ? 'outlined' : null}}</span>
        &lt;/v-container&gt;
    &lt;/v-form&gt;
&lt;/template&gt;</pre>

输出（如果没有条件为假）：

<template>
    <v-form ref="Form"> 
        <v-container class="text-center">
            <v-text-field 


        </v-container>
    </v-form>
</template>

预期输出：

<template>
    <v-form ref="Form"> 
        <v-container class="text-center">
            <v-text-field      
        </v-container>
    </v-form>
</template>

仅当条件为真时，我才想在新行上显示内容。

我希望这是有道理的。任何帮助都将非常有价值^^

如何在HTML Pre标签中隐藏空白行？

0 个答案: