#html #vue.js #vuetify.js
#HTML #vue.js #vuetify.js
Вопрос:
Возможно, это простая проблема, но я совсем недавно начал работать с vuejs и veutify и добавил сеточную систему для приложения для управления проектами, над которым я работаю для школы, и когда я добавляю кнопку, она искажает панель. Я превратил ее в отдельный компонент и попытался встроить в панель проекта
Как я хочу, чтобы это выглядело. Это было до того, как я вложил компонент https://gyazo.com/04ca8e62f32f2077d739dd9f7d6b55be
Как это выглядит сейчас https://gyazo.com/919725a55ccec56e133b231404c18590
Штрих-код моего проекта
<!-- Need to do container -->
<v-container fluid grid-list-md text-xs-center>
<v-layout column>
<v-flex>
<v-card dark color="blue">
<v-card-text class="px-0">Need to Do</v-card-text>
<v-flex>
<!-- Nested--> <AddTask />
</v-flex>
< /v-card>
</v-flex>
</v-layout>
</v-container>
Код моей кнопки
<template>
<v-dialog max-width="800px">
<v-btn fab small color="cyan accent-2" bottom left block
absolute
slot="activator">
<v-icon>add</v-icon>
</v-btn>
<v-card>
<v-card-title>
<h2>Add a Task or Project</h2>
</v-card-title>
<v-card-text>
</v-card-text>
</v-card>
</v-dialog>
</template>
Комментарии:
1. Кто-нибудь знает, что происходит?
Ответ №1:
для перемещения AddTask
между <v-card-text class="px-0">
используйте приведенный ниже код для project bar codepen : https://codepen.io/anon/pen/bZPxwW
<v-container fluid grid-list-md text-xs-center>
<v-layout column>
<v-flex>
<v-card dark color="blue">
<v-card-text class="px-0">Need to Do
<!-- Nested--> <AddTask />
</v-card-text>
</v-card>
</v-flex>
</v-layout>
</v-container>