javascript - Vue.js 应用程序从新页面的下拉菜单中打开 url 链接

Question

我的代码是

               <div class="md-list-item-content">
                <drop-down direction="down">
                  <md-button
                    slot="title"
                    class="md-button md-button-link md-white md-simple dropdown-toggle"
                    data-toggle="dropdown">
                    <i class="material-icons">view_day</i>
                    <p>Links</p>
                  </md-button>
                  <ul class="dropdown-menu dropdown-with-icons">
                    <li
                      v-for="li in linksExternal"
                      :key="li.name">
                      <a :href="li.href" >
                        <i class="material-icons">{{ li.icon }}</i>                            
                      </a>
                    </li>
                  </ul>
                </drop-down>
              </div>

我的脚本代码是

      linksExternal: [
     { name: "NCI Dictionary",  href: "https://www.cancer.gov/publications/dictionaries/cancer-terms target='_blank'" , icon: "dns" }
      ]

我试图在不同的位置添加 target='_blank'，例如在 HTML 中的标签位置，但它仍然总是在同一个选项卡中打开，或者我的语法可能不正确。有人可以指出我正确的方向吗？这是一个 Vue 特定的项目，还是我应该使用调用 window.open 的函数以不同的方式执行它？如果可以的话，我会尝试使用 Vue 最佳实践方法。这应该是一个简单的查找解决方案，但我还没有找到解决方案。

标签： javascripthtmlvue.js

Answer 1

尝试target="_blank"在里面使用：

<a :href="li.href" target="_blank"> <i class="material-icons">{{ li.icon }}</i> </a>