Next 2와 3에서 현재 경로 이름을 얻는 방법은 무엇입니까?
정적인 웹사이트를 구축하기 위해 Nuxt.js를 사용하고 있습니다.
구성 요소에서 액세스하는 방법script코드가 현재 표시된 경로 이름(브라우저 위치에서 직접 URL을 읽는 것을 피하고 싶습니다)?
어떻게든 접근할 수 있습니까?$route.name?
Next2에서
예, 당신은 vuejs 경로 객체를 사용할 수 있습니다.$route.name또는$route.path
$nuxt.$route.path
현재 경로 반환
$nuxt.$route.name
현재 경로의 이름(경로가 있는 경우)
경로 개체는 현재 활성 경로의 상태를 나타냅니다.여기에는 현재 URL의 구문 분석된 정보와 URL과 일치하는 경로 레코드가 포함됩니다.
$route.path
유형: 문자열
현재 경로의 경로와 동일한 문자열로, 항상 절대 경로로 확인됩니다(예: "/foo/bar").
$route.fullPath
유형: 문자열
쿼리 및 해시를 포함한 전체 확인 URL입니다.
**
그리고 url params를 받고 싶다면요.이와 같이: 다음을 수행:
data() {
return {
zone: this.$nuxt.$route.query.zone,
jour: this.$nuxt.$route.query.jour
} },
**
Vue2에서
다른 방법은 다음 중 하나를 사용하는 것입니다.
this.$route.path예:http://localhost:3000,{{this.$route.path}}인쇄 예정/this.$route.name예:http://localhost:3000,{{this.$route.name}}인쇄 예정index
Nuxt3 및 Composition API를 사용하면 다음과 같은 이점을 얻을 수 있습니다.
<script setup>
const route = useRoute()
console.log('current name', route.name)
</script>
또는 옵션 API 포함
<script>
export default {
mounted () {
console.log('current name', this.$route.name)
},
}
</script>
여기 제 이전 답변에 나와 있는 것처럼, https://stackoverflow.com/a/72212136/8816585 .
다음 3번용
export default ({
setup () {
const route = useRoute()
return {
route
}
}
})
템플릿 뒤에
{{ route.name }}
Nuxt v2 컴포지션 API용
import { computed, defineComponent, useRoute } from '@nuxtjs/composition-api' export default defineComponent({ setup() { const route = useRoute() const routeName = computed(() => route.value.name) return { routeName } }, })
Next 3의 경우 라우터에서 currentRoute를 사용할 수 있습니다.
const { currentRoute } = useRouter();
const routeName = currentRoute.value.name;
언급URL : https://stackoverflow.com/questions/44748575/how-to-get-current-route-name-in-nuxt-2-and-3
'programing' 카테고리의 다른 글
| POI / Excel : "상대적" 방식으로 공식 적용 (0) | 2023.06.13 |
|---|---|
| 'finally'는 항상 파이썬에서 실행됩니까? (0) | 2023.06.13 |
| 오라클 SQL 개발자에서 clob 필드 데이터를 내보내는 방법 (0) | 2023.06.13 |
| 사용자 지정 구성 요소 | 초기화 전에 '스토어'에 액세스할 수 없습니다. (0) | 2023.06.13 |
| rs.last()가 전달 전용 결과 집합에 대해 잘못된 작업을 제공함: last (0) | 2023.06.13 |