Question

我有2列，其中1列带有文本区域。下面的代码给了我我想要的东西，除了我的文本区域很窄。我希望它是v卡的整个宽度。我想念什么？

请参阅codepen上的示例

<div id="app">
  <v-app id="inspire">
    <v-card>
      <v-container fluid>
        <v-layout row>
          <v-flex md7>
            <v-card dark color="green darken-2">
              <textarea full-width rows=30  min-height=500 v-model="message">
                </textarea>
            </v-card>
          </v-flex>

          <v-flex md5 >
            <v-card dark color="blue darken-2">
              <pre v-highlightjs="sourcecode"><code class="html">{{message}}
              </code></pre>
            </v-card>
          </v-flex>
        </v-layout>
      </v-container>
    </v-card>
  </v-app>
</div>

Answer 1

诸如full-width之类的道具由Vuetify组件实现。 <textarea>是HTML元素，因此不了解Vuetify的“魔术”道具。

<v-textarea>是您要寻找的。

https://vuetifyjs.com/en/components/textarea

或者您可以使用老式的内联样式（如果可以利用vuetfiy的优势，则不建议这样做）。

<textarea style="width:100%;"></textarea>

Vuetify TextArea Width问题

1 个答案: