vuejs2 相关问题

VueJS/Typescript 错误：找不到模块“my-module”或其相应的类型声明

我有一个带有 Nuxt 和 Typescript 的 Vue2 设置。我正在尝试使用纱线安装 vue-slick-carousel 模块，但 Typescript 给我错误：“找不到模块‘vue-slick-carousel’或......

为什么 Vuetify v-data-table 范围内的项槽无法按预期工作？

我创建了一个基于的组件。 我创建了一个基于 <v-data-table> 的组件。 <!-- DataTable.vue --> <template> <v-card outlined> <v-data-table v-bind="$attrs" v-on="$listeners" dense > <template v-for="(_, name) in $scopedSlots" #[name]="slotData" > <slot :name="name" v-bind="slotData" ></slot> </template> <v-data-table> <v-card> </template> 我想知道为什么要添加这个 <!-- Relevant code snippet --> <slot :name="name" v-bind="slotData" > DEFAULT RENDER </slot> 并使用我的自定义组件 <!-- UsersDataTable.vue --> <template> <DataTable :headers="headers" :items="users" ></DataTable> </template> 结果看起来像这样 而不是这样？ 编辑#1 更好地讨论这里。 仅当父组件未提供该插槽的内容时，才使用默认插槽内容。但是，由于您的插槽是为父级提供的每个插槽内容定义的，因此内容始终存在并且从不使用默认值 编辑（问题编辑后）： 另一方面，如果您没有将任何插槽内容传递到CustomDataTable（最后一个代码示例），则$scopedSlots为空，v-for不执行，没有插槽内容被传递到 v-data-table 并使用默认渲染... 您必须从此代码中删除 slot。因为当你定义槽时，你忽略了它里面的内容。 <template v-for="(_, name) in $scopedSlots" #[name]="slotData" > <slot :name="name" v-bind="slotData" > DEFAULT RENDER </slot> </template> 此外，您还必须定义另一个插槽。让我介绍一下您的 CDatatable 组件中的最终代码： <template v-for="slot in Object.keys($scopedSlots)" :slot="slot" > DEFAULT RENDER </template> <template v-for="(_, name) in $slots" #[name]> DEFAULT RENDER </template>

Vue & Vuex：对象键值突变后不重新渲染

我在前端使用vuex存储值 ...mapGetters({ value : 'store/value' }); 我面临着一个非常奇怪的情况： 如果我像这样更新存储值，那么它会重新渲染并更新值...

使用 vue-router 时可以有多个 id 路径吗？

有可能有这样的事情吗？ // 路由器/index.js 常量路由 = [ { 路径: '/books/:bookId/authors/:authorId', 姓名：'作者'， 道具：真实， 组件：() => import('@/

覆盖 Vuetify v-data-table 范围项插槽时如何实现自定义渲染？

<!-- DataTable.vue --> <template> <v-card outlined> <v-data-table v-bind="$attrs" v-on="$listeners" dense > <template v-for="(_, name) in $scopedSlots" #[name]="slotData" > <slot :name="name" v-bind="slotData" ></slot> </template> </v-data-table> </v-card> </template> 假设每次我有一个空值时我想要一个特定的渲染，我怎样才能实现这个目标？我将编写一些代码来帮助您更好地理解我的问题： <!-- Relevant code snippet --> <slot :name="name" v-bind="slotData" > <template v-if="slotData.value"> {{ slotData.value }} </template> <template v-else> - </template> </slot> 编辑#1 为了实现我的目标，我必须循环遍历标头而不是作用域插槽。 <!-- DataTable.vue --> <template> <v-card outlined> <v-data-table v-bind="$attrs" v-on="$listeners" dense > <template v-for="{ value } in $attrs.headers" #[`item.${value}`]="slotData" > <slot :name="`item.${value}`" v-bind="slotData" > <!-- Here we can add any custom rendering logic we want --> <template v-if="slotData.value"> {{ slotData.value }} </template> <template v-else> - </template> </slot> </template> </v-data-table> </v-card> </template> 虽然此解决方案有效，但有几点需要指出： 我们依赖于插槽名称，这些名称可能会被更改并破坏我们的逻辑。 我们必须重新实现一些默认设置。例如，数组现在是这样渲染的 不再像这样了 为了防止这种行为，我们必须更新我们的代码。 <!-- Relevant code snippet --> <slot :name="`item.${value}`" v-bind="slotData" > <template v-if="!slotData.value"> - </template> <template v-else-if="Array.isArray(slotData.value)"> {{ slotData.value.join(', ') }} </template> <template v-else> {{ slotData.value }} </template> </slot> 如果您只想拥有一些预先配置的道具，而不是制作基本数据表组件。我会将预配置 props 作为对象存储在项目中某处的 js 文件中，然后将其导入并使用 v-data-table 属性将该对象传递给 v-bind。 有点像这个问题的正确答案： 在 vue 属性中添加条件，而不是使用 v-if 条件

此处地图 javascript API：如何从样式编辑器 (.json) 应用样式

TLDR： 如何使用 HERE 地图编辑器的 .json 输出更改地图样式？ 因此，我在新的 HERE 地图样式编辑器中创建了一个“自定义”样式（使用其中一个预设）并导出...

如何在IIS服务器上配置Vue 2应用程序？

我需要配置 IIS 服务器和 Vue 2 应用程序的帮助，我刚刚在 Windows IIS 7 服务器上安装了带有生产版本的 vue 2 应用程序，并且一切正常，只有一件事不起作用： 当我...

VUE中使用pdfjslib加载字体时出错

您好，我在项目（pdf 查看器）中加载 pdf 时出现错误。我有一个 pdf 文件，其字体实际上是正常的，但出现此错误 警告：字体加载期间出错：CMap“baseUrl&qu...

Vue2 - 公共/私有方法实现在 mixin 中是什么样子？

我看到以下内容已记录，但我无法想象如何实现这一点。 // 甚至更好！ var myGreatMixin = { // ... 方法： { 公共方法（）{ // ...

在 VueJS 中使用父元素在 select 标签内循环

我正在尝试循环浏览 eBay 上的这些类别，它们有一个父类别，然后是子类别，但父类别需要能够选择。这意味着我无法使用

在（webpack和vue2）中包含外部js文件的最佳方法是什么

我刚刚使用webpack2和vue2开发了该项目。我有其他外部插件无法通过 npm 安装。所以我的问题是包含这些文件的最佳方式。这是我的index.h...

Prettier v3 与 @vue/eslint-config-prettier v7.x 不兼容导致编译错误

更新prettier到版本3导致编译过程中出现以下错误： > 1 | [对象承诺] | ^ 2 |导出{渲染，staticRenderFns} 在构造函数（/xxx/node_modules/@

vuetify2 v-自动完成，多项选择可调节，因此我可以选择多个或仅单个项目

我有一个 v-autocomplete ，带有多个道具，并且可以选择全部或取消选择全部。它工作完美。 现在我想要有一个选项，允许用户在 t 时仅选择 1 个项目...

带括号调用观察者与不带括号调用观察者之间的区别

在watch属性中，使用()调用属性和不使用它们有什么区别？ 导出默认值{ 手表： { // 带有 () 的语法 测试（） { 如果（这个.测试）{ //一些...

如何在 Vuetify v-data-table 行上设置“光标：指针”？ （扩展项目区域除外）

.row-pointer >>> tbody tr :...</desc> <question vote="0"> <pre><code>&lt;!-- MyDataTable.vue --&gt; &lt;template&gt; &lt;v-data-table class=&#34;row-pointer&#34;&gt;&lt;/v-data-table&gt; &lt;/template&gt; &lt;style scoped&gt; .row-pointer &gt;&gt;&gt; tbody tr :hover { cursor: pointer; } &lt;/style&gt; </code></pre> <p>使用此CSS，发现<a href="https://stackoverflow.com/questions/61785869/how-to-set-cursor-to-pointer-on-vuetify-v-data-table-rows">here</a>，光标甚至在扩展项目区域内也会发生变化，这不是我想要的。你知道如何防止这种行为吗？</p> <p><strong>编辑#1</strong></p> <p>虽然@cmfc31解决方案有点工作，但有几点需要指出：</p> <ol> <li>为了申请课程，您必须提前知道哪些表格是可点击的。</li> <li>您依赖于类名称，这些名称可能会被更改并破坏您的 CSS。</li> <li>如果您通过扩展项目槽将不可点击的表格嵌入到可点击的表格中，则此 CSS 不起作用。</li> </ol> <p>如果您正在寻找解决方法，@cmfc31 方法可能适合您，但如果您正在寻找解决方案，我想我们必须等待 Vuetify 3。</p> </question> <answer tick="false" vote="1"> <p>检查我制作的codesanbox：<a href="https://codesandbox.io/s/stack-72501803-css-not-cursor-pointer-ei812i?file=/src/components/Example.vue" rel="nofollow noreferrer">https://codesandbox.io/s/stack-72501803-css-not-cursor-pointer-ei812i?file=/src/components/Example.vue</a></p> <p>使用 <pre><code>:not()</code></pre> CSS 伪类禁用扩展内容区域上的样式。</p> <pre><code>&lt;style scoped&gt; .row-pointer &gt;&gt;&gt; tbody tr:not(.v-data-table__expanded__content) :hover { cursor: pointer; } &lt;/style&gt; </code></pre> </answer> <answer tick="false" vote="0"> <p>您可以按照您的风格使用<pre><code>::v-deep</code></pre></p> <p><pre><code>::v-deep tr:hover{ cursor: pointer; }</code></pre></p> <p>我希望这对你有用</p> </answer> </body></html>

Vuetify：如何更改 v-data-table 组件中的每页项目选择项目？

在数据表组件页脚中，有一个选择选项，我需要更改其数字 我该怎么做？

VueCompilerError：元素缺少结束标记

我最近开始使用vuejs，但我似乎没有发现这个错误是显示出来的。 即使 html 完全存在并且没有丢失标签，它也会显示错误。 我试过了，

如何通过加载器 prependData 将多变量添加到 Nuxt 中的所有 scss 文件中

我是 Nuxt 2.13 和 sass-loader 8.0.2 。我将向我的 scss 文件添加两个环境变量。我成功地通过加载器在 Nuxtjs 的构建部分添加了一个变量： 建造： { 装载机：{ sss：...

按钮的 onClick 不会更改可点击状态

我正在使用 vue3 和 options api 如下面发布的代码所示，当单击复选框时，调用 onToggleBtnClearDigitizedChanged() 导致状态从 false 更改为 true，...

Vuetify 3 选择组件占位符的行为与 Vuetify 2 不同

在Vuetify 3中，在v-model中传递一个在items数组中不可用的值，正在显示v-select中的值。理想情况下，如果值无效，它应该显示占位符文本。这是