vue.js 相关问题

Vue.js是一个开源的，渐进式的Javascript框架，用于构建旨在逐步采用的用户界面。 Vue.js主要用于前端开发，需要中级HTML和CSS。应该标记特定于Vue.js版本2的问题[vuejs2]。

我的 Vue 组件中有这个 < 我的 Vue 组件中有这个 <b-modal ...> <b-row> <b-col sm="12"> <table > <tr v-for=... :key="key"> <td><strong>{{ key }}: </strong></td> <td> {{ item }} </td> </tr> </table> </b-col> </b-row> .... 如果一个项目很长，那么表格就比b-col大如何强制表格与 b-col 大小相同。我不想只躲起来 overflow: hidden; 因为桌子还是太大了，只是隐藏了。如果没有你的CSS，很难知道，但你可以做到这一点的一种方法是将你的table设置为使用table-layout: fixed。您可以获得精美且溢出的文本。像下面这样的东西会让你的表格单元看起来很漂亮： td { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }

css xml vue.js bootstrap-vue

回答 1 投票 0

如何使用 vue-router-links 制作导航栏项目来切换导航栏？

我有一个运行良好的导航栏。除了单击某个项目时它不会关闭这一事实之外。当我单击窗口中的其他任何位置时，它确实会关闭。我在 laravel 8 和 vue-3 中工作，有

vue.js navbar

回答 2 投票 0

Vue.Draggable 可以与 Vuetify v-data-table 一起使用并允许使用表 v-slot:item。<name>?

Vuetify v-data-table 支持多种类型的槽：v-slot:body、v-slot:item 和 v-slot:item。。我们一直在广泛使用 v-slot:item.，因为它们提供了灵活的方式...

vue.js vuedraggable v-data-table

回答 3 投票 0

在 Vue.js 单文件组件中导入外部 Angular.js 库

我在 Vue.js 中有以下单文件组件。质粒标签本来是由 angularplasmid.complete.min.js 文件渲染的，但由于某种原因没有渲染。这是正确的导入方式吗...

vue.js vuejs2 vue-component

回答 2 投票 0

尝试让 Bootstrap 4 导航栏折叠在 Vue 中工作

我正在尝试使引导导航栏折叠在移动设备上工作，因为它根本不起作用。请不要在代码中提供其他依赖项，例如 vue-bootstrap 或实现 jquery...

twitter-bootstrap vue.js vuejs2 bootstrap-4 navbar

回答 2 投票 0

Vue.js 和 vuex：this.$store 未定义

我已经阅读了类似标题的问题，但由于其复杂性我无法理解它们。我认为使用我的代码会更容易为我找到解决方案。我只会包括相关...

typescript vue.js vuejs2

回答 5 投票 0

将 Selectize 应用于我的组件中的所有选择

我想将 Selectize 应用于组件中的每个选择标签。我需要将其作为一个函数的原因是因为我选择了可以通过按钮添加的选项。我想将 Selectize 应用于组件中的每个 select 标签。我需要这是一个函数的原因是因为我已经选择了可以通过按钮添加的选项。 <div class="form-group app-label"> <label class="text-muted">Level</label> <select class="rounded" v-model="entry.level"> <option value="1">Level-1</option> <option value="2">Level-2</option> <option value="3">Level-3</option> <option value="4">Level-4</option> </select> </div> <button @click="addEducationEntry" class="btn btn-primary mt-3"> Add More Education </button> ` 脚本> export default { data() { }, methods: { applySelectize() { this.$nextTick(() => { const selects = $(this.$el).find('select'); console.log('Select elements found:', selects.length); // returning 0 everytime selects.each(function () { $(this).selectize(); }); }); }, }, mounted() { this.applySelectize(); }, updated() { this.applySelectize(); }, }; </script> ` 我的所有导入都工作正常，因为我设法通过添加 selectize 手动将 select 添加到 id，但由于我是动态制作它们，所以我无法使用 id 。我想我发现了我的错误。我更改了功能：来自： const selects = $(this.$el).find('select'); 至： const selects = $("select");

vue.js selectize.js

回答 1 投票 0

禁用从 vue.js 2 中的循环创建的表的最后一个 <td> 的按钮

javascript html typescript vue.js

回答 1 投票 0

Tailwind 的 split-y 与 Vue3 的 v-for

我正在尝试将 Tailwind 的 div 应用于使用 Vue3 的 v-for 创建的 div： {{我... 我正在尝试将 Tailwind 的 divide 应用于使用 Vue3 的 v-for 创建的 div： <div v-for="(i) in [1, 2, 3]" class="divide-y divide-red-400"> <div>{{ i }}</div> </div> 但没有应用分隔线：我希望看到这个：（注意：此图像是使用相同的父 div 的 class 创建的，但没有 v-for 循环，只需静态添加子 div）那么有没有办法将分隔符应用于 v-for 循环中的项目？任何能产生相同效果的替代方案都可以。谢谢 divide-y-*类的设计使得它们位于应划分元素的parent上。因此，您可以将 divide-y-* 类添加到具有 v-for 指令的元素的父级。这是因为具有 v-for 指令的元素会被重复： Vue.createApp().mount('#app'); <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/3.4.25/vue.global.prod.min.js" integrity="sha512-sT2a1EG7Kmio5Wia95orR00Ar8F78KIVv/AHrV0998mocqYsjoG2YiYCARXrXdaMog05zYTrtaVG3+uW4UhVEA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script> <script src="https://cdn.tailwindcss.com/3.4.3"></script> <div id="app" class="divide-y divide-red-400"> <div v-for="(i) in [1, 2, 3]"> <div>{{ i }}</div> </div> </div>

vue.js vuejs3 tailwind-css

回答 1 投票 0

仅在浏览器关闭而不是刷新时注销用户

当用户关闭浏览器而不是刷新时注销用户。我使用这个，它有效，但用户也会在刷新浏览器时注销 @HostListener('窗口:卸载', ['$event']) 卸载处理程序（$事件）{ t...

javascript jquery reactjs angular vue.js

回答 3 投票 0

如何使用模块联合在Vue2中连接Vue3？

我正在尝试在 vue2 主机服务器上构建联邦 vue3 远程服务器，这可能吗？我已经证实相反的情况是可能的。 vue3 中的 vue2 可以工作，但 vue2 中的 vue3 不能工作有没有...

vue.js vuejs2 vuejs3 webpack-module-federation

回答 1 投票 0

Laravel 9 - CORS 不起作用（对 XMLHttpRequest 的访问已被 CORS 策略阻止）

我正在尝试使用 Vuejs 构建一个独立的前端 Web 应用程序，并从我构建的 Laravel 9 API 中获取数据，当我尝试从前端访问数据时，这是......