Question

我正在为主页网站创建一个动态链接框。可以在https://gogia.github.io/escape/上看到，在我的链接框中，我有一个按钮，可以创建用作链接的按钮。

选项按钮和创建的按钮的布局会相互影响，我不确定为什么。

我尝试使用多个容器将布局分离无济于事。

   <v-layout align-center>
      <v-btn
        dark
        class="accent--text"
        v-for="(item) in $store.state.linkStuff"
        :key="item"
        :href="item[1]"
      >{{item[0]}}</v-btn>
    </v-layout>

    <v-layout align-end justify-end>
      <v-icon color="info" @click="$store.state.coinMenu=true" v-ripple>mdi-currency-btc</v-icon>
      <v-icon color="info" @click="linkDialog=true" v-ripple>mdi-settings</v-icon>
      </v-layout>

不希望一个div内的这两个单独的布局会彼此更改位置。没有错误消息。

Answer 1

已解决，问题在于我将容器标志放在哪里。

    <v-container>
    <v-layout align-center justify-space-around fill-height>
      <v-btn
        dark
        class="accent--text"
        v-for="(item) in $store.state.linkStuff"
        :key="item"
        :href="item[1]"
      >{{item[0]}}</v-btn>
    </v-layout>
    </v-container>


    <v-layout align-end justify-end>
      <v-icon color="info" @click="$store.state.coinMenu=true" v-ripple>mdi-currency-btc</v-icon>
      <v-icon color="info" @click="linkDialog=true" v-ripple>mdi-link-variant</v-icon>
      </v-layout>

如何使<v-layouts>不相互影响

1 个答案: