CODEWITHSUNDEEP
htmlcssvue.js
JonesCode
JonesCode

Reputation: 39

vue.js no data rendering

I'm trying to go through a basic vue tutorial. Recently I must have changed something that is stopping anything in the vue.js from rendering on my page and I can't seem to find out why. Example: instead of displaying the value of data.product, it displays {{ Product }}. Thanks in advance for any help!
Here's a link to the project repo on gitlab: project link

Upvotes: 0

Views: 127

Answers (1)

Jns
Jns

Reputation: 3257

I'm quite sure you will see an Uncaught ReferenceError if you open the DevTools of your browser. Because in your main.js file you reference two times to non-existent variables. In your variants-array you are using Green and Blue for your variantColor as variables but non of them is defined. From context I guess you just want to display these two values as string at your page, so you have to assign a string to your variantColor variable by adding single or double quotes.

Inside your main.js change your variant array to this:

...
variants: [
 {
   variantId: 2234,
   variantColor: 'Green'
 },
 {
   variantId: 2235,
   variantColor: 'Blue'
 }
]
...

Upvotes: 1

Related Questions