Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial![](https://ecs-static.teamtreehouse.com/assets/views/marketing/shared/community-banner-white-47072046c51352fe6a69f5e691ff5700b28bb11d45197d7bdf066d9ea3f72d0c.webp)
![Frederick Bogdanoff](https://uploads.teamtreehouse.com/production/profile-photos/3657182/micro_17191528_720248238100249_3198827511052573177_n.jpg)
Frederick Bogdanoff
15,338 PointsHaving trouble displaying the back of new card.
Hey there. I'm currently having trouble displaying the back of a new card like in the tutorial. Currently the new card gets added. But I cannot display the back. Toggling the flipped property from false to true also doesn't have an effect unlike the original cards.
this is my vue instance
new Vue({
el: '#flashcard-app',
data: {
cards: cards,
newFront : '',
newBack : ''
},
methods: {
toggleCard: function(card){
card.flipped = !card.flipped;
},
addNew: function(){
this.cards.push({
front: this.newFront,
back: this.newFront,
flipped: false
});
}
}
});
3 Answers
![Treasure Porth](https://uploads.teamtreehouse.com/production/profile-photos/1372102/micro_headshot8002.jpg)
Treasure Porth
Treehouse TeacherHey Frederick, it looks like in your Vue instance, you're setting both the front and the back of the card to this.newFront
. Make sure you're setting the back
property to this.newBack
:)
![Frederick Bogdanoff](https://uploads.teamtreehouse.com/production/profile-photos/3657182/micro_17191528_720248238100249_3198827511052573177_n.jpg)
Frederick Bogdanoff
15,338 PointsHaha can't believe I missed this. Thank you
![Frederick Bogdanoff](https://uploads.teamtreehouse.com/production/profile-photos/3657182/micro_17191528_720248238100249_3198827511052573177_n.jpg)
Frederick Bogdanoff
15,338 Pointsalright... Somewhat confusing.. I fiddled around by typing v-on:click="addNew()" and it worked. I even went back and changed it back to v-on:click="addNew" and it's still working like it should... I'm quite new to front end frameworks, is this unusual behaviour?
![Jeffrey Ayling](https://secure.gravatar.com/avatar/6fcf19b4b3551a9bf5887f4c5f5815ee?s=96&d=https%3A%2F%2Fecs-static.teamtreehouse.com%2Fassets%2Fcontent%2Fdefault_avatar-445fbbabfc8dc9188fb5967fe43322ee0c3e0dd1e10f378bf8343784af5a13eb.webp&r=pg)
Jeffrey Ayling
12,675 PointsTreasure Porth's code didn't work for me either. My issue, I had to adjust from...
this.cards.push({
to...
cards.push({
...took me a while to figure out.
Frederick Bogdanoff
15,338 PointsFrederick Bogdanoff
15,338 PointsHere is my template `