我如何將一個屬性傳遞給vue js上的指令？

Question

我如何獲得v-show或v-if指令的屬性值？我已經嘗試像下面的例子那樣通過但不成功。

v-show="cabin >= {{ number }}" number="5"

卻困此，自vue.js它是一種新的難找到的文檔和示例。

Answer 1

如果您使用Vue的組件，那麼你可以做這樣的事情：

Vue.Component('my-comp', { 

    template: '#my-template', 

    props: [ 
     'number', 
    ], 
    data: function(){ 
     return{ 
      cabin: 4 
     }; 
    } 
}): 

，然後在你看來，像這樣使用：

<my-comp v-show="cabin >= number" number="5"></my-comp> 
<template id="my-template"> 
    <div>Lorem Ipsum</div> 
</template> 

Answer 2

一旦你使用了自定義屬性（number），我猜你使用了一個組件。

所以，正如他所說@ user3324298，你需要的東西是這樣的：

Vue.Component('my-comp', { 
    template: '#my-template', 

    props: ['number'], 

    data: function() { 
    return { 
     cabin: 4 
    } 
    } 
}) 

但模板，應該是這樣的：

<template id="my-template"> 
    <div v-show="cabin >= number" number="5"> 
     <div>Lorem Ipsum</div> 
    </div> 
</template> 

<my-comp></my-comp> 

v-show應到組件的範圍。