vue.js - 如何在 vue 组件的 href 中添加条件？

Question

我的 vue 组件是这样的:

<template>
    <ul class="nav nav-tabs nav-tabs-bg">
        <li role="presentation">
            <a :href="baseUrl+'/search/store/'+param">
                Store
            </a>
        </li>
    </ul>
</template>

<script>
    export default {
        props: ['type', 'param'],
    }
</script>

我想在href中添加条件

如果 type = 'a' 那么 href =

<a :href="baseUrl+'/search/store/'+param">Store</a>

如果 type = 'b' 那么 href =

<a href="javascript:">Store</a>

我该怎么做？

Answer 1

另一种选择是创建计算属性:

<script>
    export default {
        props: ['type', 'param'],
        computed: {
          url () {
            return this.type === 'a'
              ? `${this.baseUrl}/search/store/${this.param}`
              : 'javascript:'
          }
        }
    }
</script>

寺庙将是:

<a :href="url">Store</a>