javascript - 如何在 vue.js 中渲染列表?

标签 javascript vue.js

我正在尝试使用 vue.js 呈现列表。数据来自 api 调用。

列表渲染正常,直到我尝试在 li 标签中添加 data-feature_id="@{{searched_feature.id}}" 。 添加时出现错误:

[Vue warn]: Error compiling template:......

<div class="search_feature_select">
    <ul>
        <li v-for="searched_feature in searched_features" data-feature_id="@{{searched_feature.id}}" @click="add_to_features_list">
        @{{searched_feature.name}}
        </li>
    </ul>
</div>

如何将 searched_feature.id 放入 data-feature_id 属性中?

最佳答案

需要在属性前加上:

<div class="search_feature_select">
    <ul>
        <li v-for="searched_feature in searched_features" :data-feature_id="searched_feature.id" @click="add_to_features_list">
        {{searched_feature.name}}
        </li>
    </ul>
</div>

关于javascript - 如何在 vue.js 中渲染列表?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53956330/

相关文章:

javascript - React HOC 渲染没有父节点的兄弟节点

javascript - 组件未通过 mapStateToProps 从 Redux 商店获取 Prop

javascript - 根据 x 距离增加行高

javascript - 在窗口加载后做一些事情

javascript - Javascript 函数必须在调用之前定义吗?

vue.js - View : Migrating to vue3?

javascript - 创建切换/开关以显示不同的信息

vue.js - 我们如何在 NUXTJS 中设置默认路由

javascript - Vue.js 中的外部 JS

javascript - 如何在 Vue 3 中使用路由器 View 制作某些组件 "keep-alive"?