VueJS Use prop as data-attribute value

thanksd's answer is right but;

for further understanding:

You can't use mustache syntax for attribute binding. Use mustache {{}} only content of a dom element, ie.

 <div>{{someValue}}</div> (THIS IS WRONG)

To bind any attribute, including template props any other attribute, such as "src" or "data-tab-url" like in question, you can use "v-bind:attr" or ":attr" shorthand, ie.

 <div v-bind:src="someDataVariable"></div>

or

<div v-bind:some-prop="someMethod()"></div>

You can use any member(data, method, computed etc.) of your component or Vue app, without "this".

Bind the attribute like this :data-tab-url="foo".

This will give the affected element a data-tab-url attribute with a value equal to the foo property of your component.