initial attempts at making the post feed link to an array

clr14003 · May 2, 2020 · 51475e9 · 51475e9
1 parent f56c195
commit 51475e9
Show file tree

Hide file tree

Showing 2 changed files with 32 additions and 38 deletions.
diff --git a/final/src/components/PlaceholderTweets.vue b/final/src/components/PlaceholderTweets.vue
@@ -1,42 +1,9 @@
 <template>
 <div id="postLog">
-	<div class="post">
-		<img class="postPFP" src="../assets/junk-tweet-pfp-1.png">
-		<span class="postMSG">lol hope this works</span>
-	</div>
-	<div class="post">
-		<img class="postPFP" src="../assets/junk-tweet-pfp-2.png">
-		<span class="postMSG">this is a second tweet</span>
-	</div>
-	<div class="post">
-		<img class="postPFP" src="../assets/junk-tweet-pfp-3.png">
-		<span class="postMSG">third tweet</span>
-	</div>
+	<ul>
+		<li v-for="post in posts">{{ post.message }}</li>
+	</ul>
 	<!-- all posts below this are copies of the above -->
-	<div class="post">
-		<img class="postPFP" src="../assets/junk-tweet-pfp-1.png">
-		<span class="postMSG">lol hope this works</span>
-	</div>
-	<div class="post">
-		<img class="postPFP" src="../assets/junk-tweet-pfp-2.png">
-		<span class="postMSG">this is a second tweet</span>
-	</div>
-	<div class="post">
-		<img class="postPFP" src="../assets/junk-tweet-pfp-3.png">
-		<span class="postMSG">third tweet</span>
-	</div>
-	<div class="post">
-		<img class="postPFP" src="../assets/junk-tweet-pfp-1.png">
-		<span class="postMSG">lol hope this works</span>
-	</div>
-	<div class="post">
-		<img class="postPFP" src="../assets/junk-tweet-pfp-2.png">
-		<span class="postMSG">this is a second tweet</span>
-	</div>
-	<div class="post">
-		<img class="postPFP" src="../assets/junk-tweet-pfp-3.png">
-		<span class="postMSG">third tweet</span>
-	</div>
 </div>
 </template>
 
@@ -46,7 +13,10 @@
   props: {
     msg: String
   }
-}
+}	
+
+
+
 </script>
 
 <style>
@@ -62,4 +32,18 @@
 	overflow-y: scroll;
 }
 
-</style>
+</style>
+
+
+<!-- <div class="post">
+		<img class="postPFP" src="../assets/junk-tweet-pfp-1.png">
+		<span class="postMSG">lol hope this works</span>
+	</div>
+	<div class="post">
+		<img class="postPFP" src="../assets/junk-tweet-pfp-2.png">
+		<span class="postMSG">this is a second tweet</span>
+	</div>
+	<div class="post">
+		<img class="postPFP" src="../assets/junk-tweet-pfp-3.png">
+		<span class="postMSG">third tweet</span>
+	</div> -->
diff --git a/final/src/main.js b/final/src/main.js
@@ -37,3 +37,13 @@ new Vue({
     });
   }
 }).$mount('#app')
+
+/*var app = new Vue ({
+  el: '#postLog',
+  data: {
+    posts: [
+    { message: "first" },
+    { message: "second" },
+    { message: "third" }]
+  }
+})*/