小编Otu*_*tus的帖子

在 nunjucks 中循环对象时如何限制迭代次数

我有一个像这样的 JSON 对象

{
    "data": [
        {
            "src": "src1",
            "name": "name 1"
        }, 
        {
            "src": "src2",
            "name": "name 2"
        }, 
        {
            "src": "src3",
            "name": "name 3"
        }
    ]
}
Run Code Online (Sandbox Code Playgroud)

现在我用 Nunjucks 循环遍历它:

{% for object in data %}
    {{object.src}}
{% endfor %}
Run Code Online (Sandbox Code Playgroud)

但我想在这种情况下将迭代次数限制为 2(以创建对象的候选列表)。

我如何用 Nunjucks 做到这一点?

我知道有一个范围选项,但在这种情况下我找不到如何使用它。

html json nunjucks

3
推荐指数
1
解决办法
2046
查看次数

Vue.js - 更新路由器视图

我是 Vue.js 新手,遇到了这个问题。

我在 App.vue 中有这段简单的代码

<div v-for="brand in response" v-bind:key="brand.BrandId">
    <router-link v-bind:to="{name: 'brand', params: {brandId: brand.BrandId } }">
        {{brand.Name}}
    </router-link>
</div>
<router-view />
Run Code Online (Sandbox Code Playgroud)

router/index.js 路由数组项如下所示:

{
    path: '/brand/:brandId',
    name: 'brand',
    component: () => import('../views/BrandDetail.vue')
}
Run Code Online (Sandbox Code Playgroud)

我收到了 API 的回复。它是一个有效的对象数组。菜单显示得很好。

我希望路由器视图在单击路由器链接时更新。它确实会更新 URL (#/brand/id),但路由器视图不会更新。

还有其他硬编码的路由器链接。如果我去那里并返回到任何动态添加的路由器链接,它会按预期工作,但如果我单击一个动态路由器链接,然后单击另一个,则路由器视图会卡在第一个链接中。

我还尝试向密钥添加反应式数据源,但这没有帮助。

有人可以向我解释一下这是怎么回事吗?

javascript vue.js vue-router vuejs2

2
推荐指数
1
解决办法
2759
查看次数

标签 统计

html ×1

javascript ×1

json ×1

nunjucks ×1

vue-router ×1

vue.js ×1

vuejs2 ×1