Send an Object to Vue from PHP

Question

I'm trying to set an extra css class for my object. In my props I have

customClass: {
        type: Object,
        default: function () {
            return {};
        },
    },

and I'm trying to set my customClass (custom-class) in my PHP code as such:

$('.ac-col-12.tokenizer-wrapper')
    .append('<tokenizer-wrapper :value=\'<?= json_encode($visit['tags']) ?>\' ' +
    'custom-class=\'{tag-visit}\''+
    'term=\'search\' label=\'<?= t('Tags'); ?>\' position=\'top\'>' +
"</tokenizer-wrapper>");

But I'm not passing the custom-class as a correct object so I'm receiving:

[Vue warn]: Invalid prop: type check failed for prop "customClass". Expected Object, got String.

How can I send the custom-class as object? suggestions?

You're missing the leading : on your custom-class attribute in the append() call. — John Ellmore
– John Ellmore, Commented Mar 15, 2018 at 17:46
@JohnEllmore but when I add : I have error: invalid expression: Unexpected token - in {tag-visit} — Nicky Mirfallah
– Nicky Mirfallah, Commented Mar 15, 2018 at 17:49
@NickyMirfallah well, {tag-visit} isn't a valid JS object. Try replacing it with a valid object. — John Ellmore
– John Ellmore, Commented Mar 15, 2018 at 17:50
@NickyMirfallah something like {x: 1} is a valid object. Maybe you meant to say something like {"tag-visit": "somevalue"}? — John Ellmore
– John Ellmore, Commented Mar 15, 2018 at 17:54

John Ellmore · Accepted Answer · 2018-03-15 17:59:15Z

1

You're missing the leading : on your custom-class attribute in the append() call. Also, make sure you're passing in a valid object; maybe you meant {"tag-visit": "somevalue"} instead of {tag-visit}?

answered Mar 15, 2018 at 17:59

John Ellmore

2,2291 gold badge13 silver badges22 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Send an Object to Vue from PHP

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related