비동기방식? 동기방식? 도저히 방법이 생각안납니다..

Question

을 여러 페이지에서 공통으로 사용해주기 위해 컴포넌트를 따로 만들어서 사용중입니다. 코드는 부모페이지와 컴포넌트인 자식페이지가 있는데요. 예를 들어, 부모페이지는 아래와 같습니다. **부모페이지 : import Radio from '주소/Radio.svelte'; // 자식페이지 공통 컴포넌트 import //html부분 //props //스크립트부분 onMount(()=>{// 컴포넌트가 DOM 에 추가될때 실행됨 setButton(); }); function setButton(){// db에 있는 값을 버튼에 세팅해주는 부분 document.get~~~~.style.display = "none"; // 여기서 에러남 } **자식페이지(공통컴포넌트) : export let name = 부모페이지에서받아온파라미터값 export let id = 부모페이지에서받아온파라미터값 export let grpcd = 부모페이지에서받아온파라미터값 ... async function makeRadioInput(){ //DB 통신 부분 : 부포페이지에서 받아온 그룹코드 받아서 db에서 조회해옴 reponse = await Api.post('컨트롤러~'); return response } {#await makeRadioInput() then list} {#each list as dtlCd} //아래에 있는 input 태그가 부모페이지에 로드됨. {dtlCd.Nm} {/each} {/await} 지금 문제점이 부모페이지에 접속하게 되면 자식 페이지의 makeRadioInput() 함수가 먼저 실행됩니다. 그런데, 자식페이지의 함수가 끝나기전에 부모페이지의 onMount()가 중간에 실행되는게 문제인데요. 자식페이지의 html이 로드 되지 않았는데 자식페이지의 노드를 찾으려고 하니 에러가 납니다 ㅠ 동기/비동기 방식 찾아서 적용해봤는데.. 답이 안나오고 있습니다. 자식페이지의 함수가 끝날때 까지 부모페이지의 onMount 가 실행안되게 하고 싶은데 방법 조언 받을 수 있을까요? tick()사용해줘도 안됩니다..

카르단테 · Answer

자식 페이지(?)에서 자체적인 로직 다 처리 후 수동적으로 부모페이지(?)의 onMount 메소드를 호출하면 되는 것 아닌가요?부모 페이지(?)에서 자식 페이지(?)의 처리가 다 끝났는지 어떻게 확인하시길래 (callback 을 붙이신 것도 아닌 것 같고...)부모 페이지(?)에서 onMount 메소드를 호출하시는 건가요?처음부터 이벤트 처리 순서를 고민해서 다시 구현해 보세요...

Clickin · Answer

props로 구현하는게 좋다고 말씀드렸었는데 찾아보셨나 모르겠습니다.다음 링크 한번 참조해보세요https://svelte.dev/repl/10f1e41e4fc3465d81bba5efcff84c4a?version=4.2.15

비동기방식? 동기방식? 도저히 방법이 생각안납니다..

2개의 답변

Q&A 목록