Как привязать к атрибуту в Vue JS?

я получил эту ошибку

интерполяция внутри атрибутов удалена. Используйте v-bind или вместо двоеточия стенографии. Например, вместо <div id="{{ val }}">, использовать <div :id="val">.

в этой строке

<a href="/Library/@Model.Username/{{myVueData.Id}}">

он работает в угловом 1. Как вы это делаете в Vue?

2 ответов


в вашем шаблоне:

<a :href="href">

а ты ставь href на data:

new Vue({
  // ...
  data: {
    href: 'your link'
  }
})

или использовать вычисляемое свойство:

new Vue({
  // ...
  computed: {
    href () {
      return '/foo' + this.someValue + '/bar'
    }
  }
})

вы можете использовать стенографию : или v-bind

<div>
    <img v-bind:src="linkAddress">
</div>

new Vue({
        el: '#app',
        data: {
            linkAddress: 'http://i3.kym-cdn.com/photos/images/newsfeed/001/217/729/f9a.jpg'
        }
});

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

    new Vue({
            el: '#app',
            data: {
                finishedLink: '<a href="http://google.com"> Google </a>' 
            }
    });