+1 vote
in VueJS by

How do you pass multiple values to a directive?

1 Answer

0 votes
by

A directive can take any valid javascript expression. So if you want to pass multiple values then you can pass in a JavaScript object literal. Let's pass object literal to an avatar directive as below

<div v-avatar="{ width: 500, height: 400, url: 'path/logo', text: 'Iron Man' }"></div>

Now let us configure avatar directive globally,

Vue.directive('avatar', function (el, binding) {

  console.log(binding.value.width) // 500

  console.log(binding.value.height)  // 400

  console.log(binding.value.url) // path/logo

  console.log(binding.value.text)  // "Iron Man"

})

Related questions

0 votes
asked Feb 4, 2020 in VueJS by rajeshsharma
0 votes
asked Dec 21, 2023 in C Plus Plus by GeorgeBell
...