Wasim
Wasim

Reputation: 5113

Vue.js dynamic values for component properties

In Vue.js I'm trying to pass values from a loop as properties for a custom component.

<template v-for="upload in uploads">
   <upload-container index="{{ $index }}" filename="{{ upload.name }}"></upload-container>
 </template>

Unfortunately this does not work and it only passes through the literal strings {{ $index }} and {{ upload.name }} instead of the actual values.

Upvotes: 1

Views: 991

Answers (1)

zxzak
zxzak

Reputation: 9446

The values are in fact, passed down as strings. If you want to evaluate the expressions you need to use dynamic syntax.

<template v-for="upload in uploads">
   <upload-container :index="$index" :filename="upload.name"></upload-container>
 </template>

Literal vs Dynamic

Upvotes: 2

Related Questions