#html #vue.js
Вопрос:
Я просто хочу написать класс plan__part_${this.res}
внутри элемента
v-bind:class="{[`plan__part_${this.res}`]: true }" :key="item.id" gt;lt;/divgt;```
Ответ №1:
Как вы можете видеть в следующем фрагменте кода, ваш код работает нормально, не используйте this
в шаблоне:
new Vue({ el: '#demo', data() { return { res: '1', item: {id: 1} } } }) Vue.config.productionTip = false Vue.config.devtools = false
.plan__part_1{ background: violet; }
lt;script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"gt;lt;/scriptgt; lt;div id="demo"gt; lt;div :class="{[`plan__part_${res}`]: true }" :key="item.id"gt; {{ res }} lt;/divgt; lt;/divgt;
Ответ №2:
В этом случае, если ваша текущая реализация не работает, вы можете попробовать использовать вычисленные
v-bind:class="getClass" :key="item.id" gt;lt;/divgt;
и в
computed: { getClass() { if(this.flag) return `plan__part_${this.res}`; return ''; }
Примечание: this.flag
на самом деле это логическое значение, которое вы использовали в шаблоне