Блог

Я использую vue2 в своем проекте.

У меня есть свойство img_path и класс txt-отключен:

 <script> 
  export default {
    props: {
      img_path: { required: false },
      title: { required: false }
    },
    components: {  },
    computed: {},
    methods: {},
  };
</script>

<style>  
  .txt-disabled{
    color:lightgray;
  } 
</style>
 

когда свойство пустое, я хочу применить класс css с отключенным txt для охвата элемента:

  <span :class="{ img_path: txt-disabled }">{{title}}</span>
 

Но в примере выше txt-отключенный класс не применяется.

Есть идеи, почему класс не применяется?

Вам нужно указать класс css в качестве ключа, а условие — в качестве значения, см. Пример здесь:

 <span :class="{ 'txt-disabled': !img_path }">{{title}}</span>