How to add a property with Vue.JS

Question

I want to add this property to my button element:

uk-toggle="target: #id"

So, the result must be:

<button uk-toggle="target: #id" type="button">Click</button>

But I need to do that with Vue.JS and I don't know how, I'm trying with this:

<button v-bind: uk-toggle= "target: 'movie.title'" type="button">

But it doesn't works, so.. any ideas? thanks

Answer 1

I'm assuming that you have movie.title defined on your component data and you want that value to end up as value for uk-toggle .

In that case try this:

<button :uk-toggle= "'target:' + movie.title" type="button">

Answer 2

uk toggle work like this

     <button class="uk-button uk-button-default" type="button" 
       uk-toggle="target: #toggle-usage">Toggle</button>
        <p id="toggle-usage">Hello</p>

https://getuikit.com/docs/toggle

So here in vueJs are you binding the message in movie.title ?

<button :uk-toggle= "target:#toggle-usage" type="button">
<p id="toggle-usage">Hello</p>

try this value is getting bind so you can easily convert to dynamic values