需要用VUEJS同时遍历2个对象

Question

我只想以相同的速度浏览 POSTS 和 USERINFO，以便为给定的 post

显示正确的用户头像

对象

   posts : {!! $posts !!},
   userinfo : {!! $userinfo !!},

模板

< v-cloak v-for="post in posts">
  <div v-bind:style="{ backgroundImage: 'url(' + post.picture + ')' }">
<a href="{{-- url("#" v-bind:style="{ backgroundImage: 'url(' + userinfo.avatar + ')' }"></a>
</div>

不知道怎么...基本上...

Answer 1

我认为您可以向您的用户对象添加一个属性 id。并为您的 post 对象添加一个属性 userId 以避免错误。

用户必须是您元素的道具才能在其中使用

Answer 2

正确的方法（恕我直言）是以正确的方式向模板提供数据，这样模板就可以用最短的时间循环遍历数据。

支持 computed 值可能是最简单的实施方式。

您可以在计算值中使用 js 创建一个复杂的循环，然后减少模板中的任何复杂逻辑。如果组件或模板的其他部分发生变化，这还可以减少渲染或重新计算所需的次数。

其他选项是使用手表或从 api 回调

更新 data.variable

需要用VUEJS同时遍历2个对象

Need to go through 2 objects at the same time with VUEJS

laravel

vue.js

v-for

对象

模板