Programing

페이지 다시 로드에서 매개 변수가 작동하지 않는 vue-properties 경로

c10106 2022. 3. 9. 11:43
반응형

페이지 다시 로드에서 매개 변수가 작동하지 않는 vue-properties 경로

나는 내 프로젝트에 부에로터를 사용하고 있다.

나는 내가 명명된 경로로 완벽하게 항해할 수 있다.나의 유일한 문제는 매개 변수를 예상하는 명명된 경로를 사용할 때 페이지를 새로 고칠 때 로드되지 않는다는 것이다.

내가 갈 길은 여기야.

'/example/:username': {
    name: 'example-profile',
    title: 'Example Profile',
    component: ExampleComponent
}

이게 내가 사용하는 방법이야vue-router route:

<a v-link="{ name: 'example-profile', params: { username: raaaaf } }">
    Example Link
</a>

선택 시Example Link알겠다mydomain.com/example/raaaaf.

처음 로드할 때는 올바른 템플릿을 렌더링하지만, 주소 표시줄의 링크를 새로 고치거나 수동으로 입력하면 내 템플릿으로 리디렉션됨Page Not Found페이지 및 페이지 작성 시 호출되는 메서드는 트리거되지 않는다.

이게 내가 가지고 있는 거야.ExampleComponent:

    <template>
    <div class="small-12 left">
        <side-bar></side-bar>
        <div class="store-right">
            <store-details></store-details>
            <store-menu></store-menu>
            <store-listings></store-listings>
        </div>
    </div>
    </template>
    
    <script>
        export default {
            data() {
                return {
                    username: null,
                    user: null,
                }
            },
    
            created() {
                this.getUser()
            },
    
            methods: {
                getUser() {
                    console.log(this.$route.params);
                }
            }
        }
    </script>

같은 문제에 직면하면 다른 사람이 있을지는 모르겠지만, 나는 새로 고침 시 경로 파라미터를 얻는 데 문제가 있었다.내가 얻으려고 했던 경로 매개변수는 ID 번호였고 나는 데이터를 가져오고 페이지를 채우기 위해 그 ID를 사용한다.새로 고쳤을 때 (여러 콘솔 로그를 통해) 숫자가 문자열로 바뀌어 페이지가 작동하지 않는 것을 발견했다.나는 그것을 분류했지만 그것을 사용하기 전에 ID를 번호로 돌렸다.

Number($route.params.id)

서버를 제대로 구성해야 한다.서버가 기본적으로 에서 인덱스 파일을 찾고 있는 경우/example/raaaaf전화번호부나는 이 페이지를 주의깊게 읽었다: http://router.vuejs.org/en/essentials/history-mode.html

참조URL: https://stackoverflow.com/questions/39950582/vue-router-route-with-params-not-working-on-page-reload

반응형