라우터 매개 변수의 프로펠러 유형이 잘못되었습니다. 수에 문자열이 있어야 합니다.

라우터 매개 변수의 프로펠러 유형이 잘못되었습니다. 수에 문자열이 있어야 합니다.

수집하려고 합니다.id값을 지정합니다.

이전에 저는 이 게시물에 도움을 받았습니다.

인마이index.js라우터 파일의 다음 코드:

{   path: '/word/:id',
    name: 'word',   
    component: Word,
    props: true,
}, 

내 컴포넌트에는 다음 코드가 있습니다.

<script>
    export default {
        props: {
             id: Number,
        },
        created() {
             this.routeChanged();
        },
        watch: {
            'id': 'routeChanged',
        },
        methods: {
            routeChanged () {
                console.log(this.id);
            },
        },
    };
</script>

다음과 같은 에러가 발생합니다.

[Vue warn] :잘못된 프로펠러: 프로펠러 "id"에 대한 형식 검사에 실패했습니다.예상 번호입니다. 문자열이 있습니다.

다음은 기능 모드를 사용하여 구성요소를 라우팅하기 위한 소품 전달의 사용 사례입니다.

소품을 돌려주는 기능을 만들 수 있습니다.이를 통해 파라미터를 다른 유형으로 캐스팅하거나 스태틱 값을 루트 기반 값과 조합할 수 있습니다.

이 경우 루트 옵션을 지정하는 대신props: true에 함수를 전달합니다.props옵션:

routes = [{
  path: '/word/:id',
  component: Word,
  props: castRouteParams
}];

function castRouteParams(route) {
  return {
    id: Number(route.params.id),
  };
}

라이브 예: https://codesandbox.io/s/8kyyw9w26l ("Go to Test/3" 링크 클릭)

언급URL : https://stackoverflow.com/questions/51418072/invalid-prop-type-from-router-params-expected-number-got-string