Как я могу передать свойство в директиву vue js?

Question

Как я могу получить значение свойства на v-show или же v-if Директива? Я уже пытался передать, как пример ниже, но не удалось.

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

Я застрял с этим, и так как vue.js это что-то новое, его так сложно найти документацию и примеры.

Answer 1

Если вы используете Vue Components, вы можете сделать что-то вроде этого:

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 должно быть в рамках компонента.