时间戳

首页 > 解决方案 > vue组件中动态显示序列号

vue.js - vue组件中动态显示序列号

问题描述

让我解释一下我到底在寻找什么。我有一个项目，它有测验式面试，这次面试有问题。我有 3 种用户类型，每种类型都有自己的问题。例如，一个用户可以有多个角色。如果用户选择 2 个角色，那么我需要向他们展示两种类型的问题。

所以我在这里使用vue js。

我制作了一个名为的基本组件Interview.vue，在这个组件中，我还有 3 个专门针对这些类型用户的子组件。

假设我有 3 种类型的用户 - 1) 厨师 2) 服务员 3) 酒保 因此，如果用户选择角色厨师和酒保，那么我将渲染这两个组件，这些组件将对特定角色有疑问。

可以说...我Chef.vue有2个问题。并Barman.vue有3个问题。

所以我渲染了这两个组件，我会在网页上看到 5 个问题。

我的问题是如何给每个问题一个序列号。?

标签： vue.jsvuejs2vue-component

解决方案

You could create a counter that is available globally and increments with every use.

Here's an example implementation:

Vue.prototype.$elNum = 0;
Vue.prototype.$getElNum = () => Vue.prototype.$elNum += 1;

then whenever you are creating an element anywhere in the app, you can set the key or serialNumber by setting it to this.$getElNum()

推荐阅读