javascript - 点击详细信息上的Vue列表项
问题描述
我有这个 Vue 应用程序
var app = new Vue({
el: '#main',
delimiters: ['${', '}'],
data () {
posts: [
{
id: 1,
title: 'Post title 1',
description: 'Post description 1'
},
{
id: 2,
title: 'Post title 2',
description: 'Post description 2'
},
{
id: 3,
title: 'Post title 3',
description: 'Post description 3'
}
],
},
methods: {
getPostData: function (event) {
}
}
});
<div id="main">
<ul>
<li v-for="(post, index) in posts"><a @click="getPostData">${ post.title }</a></li>
</ul>
</div>
这里是点击项目的描述
我想单击列表中的一个项目并在#item-description div 中显示该项目的描述。
我如何对此 getPostData 进行编程以从我单击的项目中获取描述。
肿瘤坏死因子
解决方案
<div id="main">
<ul>
<li v-for="(post, index) in posts"><a @click="getPostData(post.description)">${ post.title }</a></li>
</ul>
</div>
methods: {
getPostData: function (postDesc) {
// you got the post Desc
}
}
推荐阅读
- node.js - 在 Node.js 中更改某些字段名称时,将 multipart/form-data 请求传递给另一个请求
- mysql - 当 BigQuery 中的值是字符串或日期时,Case 如何与 else 一起使用?
- tensorflow.js - 带有 earlyStopping 和训练日志的 TensorflowJS 不起作用
- magento-1.9 - 我自己在社区冷库中定义的块类。但它不适用于相关模板(Magento 1.9 版扩展开发)
- docker - 容器之间如何共享用户?
- sql-server - 触发错误microsoft sql server studio 2018
- otrs - 如何重置或删除 OTRS 票的所有者?
- laravel - 如何强制重新加载页面以使 POST 请求通过
- r - 从数据框中获取点击流序列
- vba - 如果找到字符,VBA 从字符中修剪字符串