vue.js - Vuetify 在 v-autocomplete 上使用附加时无法定位目标

标签 vue.js vuetify.js

我想使用 autocomplete来自 Vuetify,我在那里面临问题,因为在我的网站上,我有一个外部 div position: relative autocompelete 的下拉部分,即 position: absolute,不是附加到 input 的底部,而是附加到随机位置。

Autocomplete 有一个属性 attach ,它 指定这个组件应该分离到哪个 DOM 元素。使用 CSS 选择器字符串或对元素的对象引用。 所以我想我使用它并将其设置为我的输入类。

这可行,但会在控制台中引起警告

[Vuetify] Unable to locate target v-autocomplete

found in

---> <VMenu>
       <VAutocomplete>
         <VCard>
           <VApp>
             <Root>

Here我重现控制台警告的链接。

最佳答案

如果您没有在 App.vue 中使用 v-app 组件,请确保将 data-app 属性添加到 div 中App.vue 中的 id app

结果会像下面这样:

<template>
    <div id="app" data-app>
        ....  All components, routers, views  here ...
    </div>
</template>

关于vue.js - Vuetify 在 v-autocomplete 上使用附加时无法定位目标,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55421235/

相关文章:

css - 除非复制并粘贴回浏览器样式编辑器,否则 VueJS 编译的应用程序 css 不起作用

javascript - 如何防止模糊在 v-combobox 中添加输入

javascript - Vue 如何在加载数据填充工作表之前将文本作为 v-card 中的占位符?

node.js - 在 vue.js 中找不到模块 'mini-css-extract-plugin'

javascript - Nuxt/Gitlab : WARNING: public: no matching files ERROR: No files to upload

javascript - Vuetify动态创建v-select

vue.js - 无法阻止 v-select 组件的值发生变化

javascript - javascript切换淡入淡出效果

vue.js - Vuex 存储状态在控制台中未定义,但 Vue 工具显示工作正常

javascript - 如何在内部 v-tooltip 悬停时关闭外部 v-tooltip