학원/프로젝트
[Vue.JS] Vue CDN 사용시 쿼리 저장 이벤트
행수쌤
2023. 7. 22. 14:35
728x90
반응형
쿼리값 page 필드로 반환 메서드
initializePageFromQuery() {
const queryParams = new URLSearchParams(window.location.search);
const queryKey = queryParams.get('queryKey');
this.adminMenu = adminMenu;
},
쿼리 업데이트를 위한 page 데이터 변경 및 쿼리 변경 메서드
saveQuery(queryInfo){
const queryParams = new URLSearchParams(window.location.search);
queryParams.set('queryInfo', queryInfo);
const newURL = `?`+queryParams.toString();
//쿼리 히스토리 저장
window.history.pushState({ query: queryParams.toString() }, '', newURL);
},
mounted()
//쿼리 초기화 및 변화 감지
this.initializePageFromQuery();
//뒤로가기, 앞으로가기 누르면 이전 쿼리 반환
window.addEventListener('popstate', this.initializePageFromQuery);
728x90
반응형