Home > OS >  How can I pass dynamic value to href property in table created with vue,js
How can I pass dynamic value to href property in table created with vue,js

Time:09-05

Dobry den, everybody! I have a daynamic table, created with vue.js

<tbody>
   <tr v-for="(row, index) in tableData">
     <td>{{ (index   1)  }}</td>
     <td>{{ row.link }}</td>
     <td>{{ row.location}}</td>
     <td >{{ row.useful }}</td>
     <td >{{ row.useless }}</td>
     <td >{{ row.neverResponded }}</td>
   </tr>
 </tbody>

Now I want to make a link clickable but don`t know how to do it. Here is what I tried:

 <tbody>
   <tr v-for="(row, index) in tableData">
     <td>{{ (index   1)  }}</td>
     <td><a href="{{ row.link }}">{{ row.link }}</a></td>
     <td>{{ row.location}}</td>
     <td >{{ row.useful }}</td>
     <td >{{ row.useless }}</td>
     <td >{{ row.neverResponded }}</td>
   </tr>
 </tbody>

But value is not passed because of quotes (obviously). Is there any way to pass this variable to href? Thank you!

CodePudding user response:

You can bind your link:

<td><a :href="row.link">{{ row.link }}</a></td>
  • Related