Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

shariff's avatar
Level 50

how to concatenate a json key in vuejs coming from laravel API

I need to concatenate a json key for displaying the contents based on the current language selected. In API I am getting the response and current language selected. The response is like below

{
  lang : "en"
  heading_ar: "قابل وتناول واستمتع بالاختبار الحقيقي"
  heading_en: "Meet, Eat & Enjoy the true test"
  description_ar: "<p>هناك حقيقة مثبتة منذ زمن طويل وهي أن المحتوى المقروء لصفحة</p>"
  description_en: "<p>It is a long established fact that a</p>"
  id: 1
}

in template I should display the contents. But I cannot able to concatenate lang in heading . I tried different ways but nothing is working.

<template>
<h1 class="banner-title">{{banner.home.heading_+banner.home.lang}}</h1>
</template>

thank you

0 likes
4 replies
Sinnbeck's avatar
Sinnbeck
Best Answer
Level 102

You do this

{{banner.home['heading_' +banner].home.lang}}
1 like
shariff's avatar
Level 50

@sinnbeck thank you for awesome idea. Finally it is working now. I tried like this

{{ banner.home["heading_"+banner.home.lang+""]}}

Please or to participate in this conversation.