2017-04-13 185 views
0

如果窺視片,是這樣的:如何在vue.js 2中使用if?

<ul> 
@if ($a) 
    @if (!$b) 
     <li> 
      <p>...</p> 
      ... 
     </li> 
    @endif 
@endif 
... 
</ul> 

我想改變它是VUE組件

我嘗試這樣的:

<ul> 
<li v-if="a" v-if="!b"> 
    <p>...</p> 
    ... 
</li> 
... 
</ul> 

看來,這是錯誤的

如何我能正確做到嗎?

+1

你爲什麼有兩個'V-if's? 'v-if =「a &&!b」'應該就夠了。 –

+0

@Amresh Venugopal,很棒。非常感謝 –

回答

1

根據@Amresh Venupogal的描述,您可以有多種選擇,或者您可以製作一個嵌套,就像您在刀片視圖中一樣。但是它會要求你添加一個額外的html元素。

選項A

<ul> 
    <li v-if="a && !b"><p>...</p></li> 
</ul> 

選項B(顯然更糟,因爲你將創建空的div你unorderd名單內)

<ul> 
    <div v-if="a"> 
    <li v-if="!b"><p>...</p></li> 
    </div> 
</ul>