Laravel лезвие и Vue. js, объединенная функция php и vue. js javascript переменная внутри шаблона

Question

Я хотел бы знать, как я могу объединить laravel php функция lang с переменной javascript. Вот пример:

Этот код не работает. Текст переменной javascript является динамическим c. Функция php lang не переводит составное слово, отображает reportParameter.txt_date

Не работает отображение reportParameter.txt_date

template: `
<div class="text-center mt-1">
    <div class="custom-control custom-radio custom-control-inline" v-for="(text, val, index) in optionsParsed">
        <input class="custom-control-input" type="radio" v-model="checked" :id="nomRadio+'_'+index" :name="nomRadio" :value="val" @change="getChecked(checked)">
        <label class="custom-control-label" :for="nomRadio+'_'+index">@lang('reportParameter.'.@{{text}}')</label>
    </div>
</div>

`

работает. Отображение даты

 template: `
<div class="text-center mt-1">
    <div class="custom-control custom-radio custom-control-inline" v-for="(text, val, index) in optionsParsed">
        <input class="custom-control-input" type="radio" v-model="checked" :id="nomRadio+'_'+index" :name="nomRadio" :value="val" @change="getChecked(checked)">
        <label class="custom-control-label" :for="nomRadio+'_'+index">@lang('reportParameter.text_date')</label>
    </div>
</div>`

Проблема в том, что переменный текст должен генерироваться динамически. Проблема только в том, как я делаю конкатенацию. Я не соединяю там правильно. Я пробую много разных способов, но безуспешно.

Большое спасибо за вашу помощь.

Answer 1

Вы можете просто добавить заполнитель к вашему тегу HTML, например так:

<template>
  <p>Hallo my name is {{ name }}</p>
</template>

Затем, если вы хотите получить имя динамически с сервера, вы просто отправляете запрос на получение имени.

Например, вы можете использовать топор ios.

<script>
export default {
  data: () => ({
    name: ''
  }),

  // going to run if the app gets mounted / page reload so to say
  mounted() {
    getName();
  },

  methods: {
    getName() {
      axios.get('/api/name')
           .then(response => name = response.data)
           .catch(error => console.log(error)
    }
  }
}
</script>