Commit @460acf2d833440bbd678cb987feaf0269efdc909

woals 2024-08-22

240822 권민수 단어장 Chapter2 각 단어의 이미지 파일 경로 가져오도록 수정

@460acf2d833440bbd678cb987feaf0269efdc909

c74be19

460acf2

client/views/pages/main/Chapter/Chapter2.vue

--- client/views/pages/main/Chapter/Chapter2.vue

+++ client/views/pages/main/Chapter/Chapter2.vue


               <article class="flex align-center">
                 <div class="imgGroup mr30">
                   <img
-                    src="../../../../resources/img/img2_1.png"
+                    :src="'http://localhost:9080/' + word.fileApath"
                     data-num="1"
                     style="width: 200px"
                   />

     return {
       wdBookId: "WORD_BOOK_000000000000042",
       wordList: [],
+      // wordContentList: [],
+      // wdContentId: "",
     };
   },
   methods: {
-    fetchWordList() {
-      axios.post("/word/getWordsByBookId.json", {
-        wdBookId: this.wdBookId,
-      })
-      .then((response) => {
-        console.log(response.data);
-        this.wordList = response.data;
-      })
-      .catch((error) => {
+
+    async fetchWordList() {
+      try {
+        const response = await axios.post("/word/getWordsByBookId.json", {
+          wdBookId: this.wdBookId,
+        });
+
+        const wordList = response.data;
+
+        // 각 word 객체에 대해 fileApath를 받아오는 요청 처리
+        const requests = wordList.map(async (word) => {
+          const fileResponse = await axios.post("/file/find.json", {
+            file_mng_id: word.fileMngId,
+          });
+
+          const fileApath = fileResponse.data.list.length > 0 ? fileResponse.data.list[0].fileApath : null;
+          console.log("각 단어의 fileApath: ", fileApath);
+
+          word.fileApath = fileApath; // fileApath 값을 해당 객체에 추가
+        });
+
+        // 모든 요청이 완료될 때까지 대기
+        await Promise.all(requests);
+
+        // 최종적으로 wordList를 설정
+        this.wordList = wordList;
+        console.log("단어 리스트 -> ", this.wordList);
+      } catch (error) {
         console.error("단어 목록을 불러오는 중 오류 발생:", error);
-      })
+      }
     },
 
     goToPage(page) {

Add a comment

Open 0
Closed 0

List

...	...	@@ -38,7 +38,7 @@
38	38	<article class="flex align-center">
39	39	<div class="imgGroup mr30">
40	40	<img
41		- src="../../../../resources/img/img2_1.png"
	41	+ :src="'http://localhost:9080/' + word.fileApath"
42	42	data-num="1"
43	43	style="width: 200px"
44	44	/>
...	...	@@ -90,20 +90,41 @@
90	90	return {
91	91	wdBookId: "WORD_BOOK_000000000000042",
92	92	wordList: [],
	93	+ // wordContentList: [],
	94	+ // wdContentId: "",
93	95	};
94	96	},
95	97	methods: {
96		- fetchWordList() {
97		- axios.post("/word/getWordsByBookId.json", {
98		- wdBookId: this.wdBookId,
99		- })
100		- .then((response) => {
101		- console.log(response.data);
102		- this.wordList = response.data;
103		- })
104		- .catch((error) => {
	98	+
	99	+ async fetchWordList() {
	100	+ try {
	101	+ const response = await axios.post("/word/getWordsByBookId.json", {
	102	+ wdBookId: this.wdBookId,
	103	+ });
	104	+
	105	+ const wordList = response.data;
	106	+
	107	+ // 각 word 객체에 대해 fileApath를 받아오는 요청 처리
	108	+ const requests = wordList.map(async (word) => {
	109	+ const fileResponse = await axios.post("/file/find.json", {
	110	+ file_mng_id: word.fileMngId,
	111	+ });
	112	+
	113	+ const fileApath = fileResponse.data.list.length > 0 ? fileResponse.data.list[0].fileApath : null;
	114	+ console.log("각 단어의 fileApath: ", fileApath);
	115	+
	116	+ word.fileApath = fileApath; // fileApath 값을 해당 객체에 추가
	117	+ });
	118	+
	119	+ // 모든 요청이 완료될 때까지 대기
	120	+ await Promise.all(requests);
	121	+
	122	+ // 최종적으로 wordList를 설정
	123	+ this.wordList = wordList;
	124	+ console.log("단어 리스트 -> ", this.wordList);
	125	+ } catch (error) {
105	126	console.error("단어 목록을 불러오는 중 오류 발생:", error);
106		- })
	127	+ }
107	128	},
108	129
109	130	goToPage(page) {

Delete comment