Vue.js 條件語句

Question

我有一個由別人用 vue.js 編寫的前端項目。 當組件加載時存在多個鏈接時，我需要添加一個條件來顯示鏈接。 如果我的某些術語不正確，我深表歉意，我之前沒有使用過 vue.js 或任何類似的東西，而且我對 JavaScript 的了解有限。

組件

這是我到目前為止所嘗試的。 我迷路的是如何在頁面加載時觸發它。

var ConceptListItem = {
    props: ['concept'],
    template: `<div class="list-group-item concept-item clearfix" id="concept-{{ concept.uri }}">
                   <div id="conceptDiv">
                       <a v-if="ident" v-on:click="select" style="cursor: pointer;">{{ concept.label }} ({{ concept.authority.name }}) {{ concept.identities[0].concepts[0] }}</a>
                       <a v-else v-on:click="select" style="cursor: pointer;">{{ concept.label }} ({{ concept.authority.name }})</a>
                   </div>
                   <div class="text text-muted">{{ concept.description }}</div>
               </div>`,
    data: function() {
         return {
             ident: false,
         }
     },
    methods: {
        select: function() {
            this.$emit('selectconcept', this.concept);
        },

    }
}

然后我嘗試添加一個函數來在 vue 模板中創建

created () {
    window.addEventListener('scroll', this.handleScroll);
    window.addEventListener('resize', this.handleScroll);
    var self = this;
    document.getElementById('graphContainer').onmouseup = function() {
        self.updateSwimRef();
        self.handleScroll();
    },
    document.getElementById('conceptDiv')il. = function() {
      self.ident = true;
    }

}, 

Answer 1

讓我們將所有鏈接保存到一個數組中，比如鏈接 []，在您的 html 中添加以下代碼

<div v-if="links.length>1">

    // your code with condition

</div>
<div v-else>
   // else part if any
</div>

在 vue 部分，您需要通過以下方式添加數組，

data: function () {
        return {

            links: [],  
      }
}