VueJS проверить, содержит ли строка подстроку в операторе if в теге v-btn - PullRequest
Новая
       6

VueJS проверить, содержит ли строка подстроку в операторе if в теге v-btn

0 голосов
/ 31 января 2020

Моя цель - проверить, содержит ли ссылка из объекта json 'http', если да, дать v-btn target = '_ blank'. Это также может быть, например, ссылка #test.

Как я это делаю сейчас: 

<v-btn
color="primary"
text
:href="x.link"
x.link.includes("http") ? target="_blank" : null
>
    Read more
</v-btn>

Это сообщение об ошибке со стрелкой указывает на первую цитату дублирования по http error: Parsing error: unexpected-character-in-attribute-name

Это то, что в x: 

0:Object
created_at:null
header:"Sport"
id:1
image_large:"https://i.picsum.photos/id/389/800/400.jpg"
image_medium:"https://i.picsum.photos/id/389/600/300.jpg"
image_small:"https://i.picsum.photos/id/389/200/200.jpg"
link:"http://example.com"
submenu:null
updated_at:null

Некоторые ob js имеют в качестве ссылки link:"#test"

Таким образом, код выдает ошибку .include но я не могу найти ничего, что решило бы эту проблему или нашло способ обойти ее.

Надеюсь, моя просьба ясна. Спасибо за помощь

1 Ответ

0 голосов
/ 01 февраля 2020

Вы помещаете синтаксис JavaScript непосредственно в "HTML", где он интерпретируется неправильно. Отсутствие объявления target и установка target для пустой строки в основном эквивалентны, поэтому вместо этого вы можете использовать обычный синтаксис :attribute для переключения между "_blank" и "": 

<v-btn
  color="primary"
  (... other things)
  :target="x.link.includes('http') ? '_blank' : ''"
>

(Обратите внимание на использование одинарных кавычек в фактическом JS коде.)

...