[Vuejs]-Props can't pass multiple data with v-bind

0πŸ‘

βœ…

I have solved the problem where only first prop is rendered because I don’t wrap with outer element for all the spans. Wrapping with div solve the problem.

    // BalanceDetail.vue
        var BalanceDetail = Vue.component('balance-detail', {
            props: {
                item: String,
                currency: String,
                balance: Object,
            },
            template: '\
            <div>
                <span class="balance-item">{{ item }}</span>\
                <span class="currency-sign">{{ currency }}</span>\
                 <span class="balance-value">{{ balance[item] }}</span>\
            </div>
            '
        })

Leave a comment