반응형
클릭 시 Vue.js에서 다른 URL로 리다이렉트하는 방법
Vue.js로 포스트보드를 만들고 있으며, 각 포스트를 클릭하면 페이지가 리다이렉트 됩니다.
vue-route와 axios를 설치했습니다.
index.js에서는
export default new Router({
route: [
{
path: '/',
name: 'Post',
component: Post
},
{
path: '/:req_no',
name: 'Detail',
component: Detail
},
]
})
포스트에.표시하다
<div @click="detailPost(post.no)">{{post.title}}</div>
.
.
.
detailPost(req_no) {
this.$router.push({
path: `https://dataURL/detail.php/${req_no}`
})
}
상세.표시하다
<template>
<div>
{{contents}}
</div>
</template>
<script>
import axios from 'axios';
export default {
name: 'Datail',
data() {
return {
req_no: this.$route.params.req_no,
contents: {}
}
},
created() {
axios.get('https://dataURL/detail.php/', {
params: {
req_no: this.req_no
}
}).then(res => {
this.contents = this.res.data
});
}
}
</script>
(포스트의 함수에 있는) URL을 어디에 넣어야 할지 모르겠습니다.Vue, detail Post() 또는 Detail.비디오)
함수에 넣으면...http://localhost:8080/#/http://dataURL/detail.php/2
API 가이드에 따르면 반드시 파라미터를 사용해야 합니다.
수리하는 것 좀 도와주시겠어요?정말 고마워!!
라우터는 다른 도메인에 사용할 수 없습니다.
다음 답변을 참조하십시오.https://stackoverflow.com/a/41654493/146656
Vanilla JS를 사용하여 실행할 수 있습니다.
window.location = `https://dataURL/detail.php/${req_no}`;
이https://dataURL/detail.php
메인 앱과 같은 도메인에 있습니까?
시험해 보세요:
this.$router.push({
path: `/detail.php/${req_no}`
})
도메인이 다르면window.location
window.location =
https://dataURL/detail.php/${req_no}
;
언급URL : https://stackoverflow.com/questions/56160738/how-to-redirect-in-vue-js-to-different-url-when-clicked
반응형
'programing' 카테고리의 다른 글
Java에서 경과된 시간을 측정하려면 어떻게 해야 합니까? (0) | 2022.08.17 |
---|---|
Nuxtjs에서 POST 요청 파라미터를 읽는 방법 (0) | 2022.08.17 |
Vue의 상위 구성 요소 및 중첩된 모든 경로를 느리게 로드합니다. (0) | 2022.08.17 |
GDB에서 #defined constant를 인쇄하려면 어떻게 해야 합니까? (0) | 2022.08.17 |
vue.dister Web 컴포넌트 등록 (0) | 2022.08.17 |