Search code examples
htmlvue.jshref

Vue href binding with static url


I want to pass a static href + a dynamic part provided through a v-for. In one of the td Something like this. Now, it's reading it as a string.

 <td class="">
             **<a class=" " href="https://xxx.yyy.us/org/ `${{currentView["projectName"]}}`"**   
    target="_blank" 
            ><img
              class="inline-block w-10"
              alt=""
              src="../assets/img/mylogo.svg"
              
          /></a>

            
          </td>
    

Solution

  • Use v-bind to bind vue instance data to html attributes.

    Shorthand for v-bind is : which we will use below

    <a class=" " :href="'https://xxx.yyy.us/org/' + currentView['projectName']"/>
    <!--...-->
    </a>