programing

vue-router 3.5.1 경고: 의 태그 프로포트가 사용되지 않으며 Vue Router 4에서 제거되었습니다.

firstcheck 2022. 7. 30. 14:00
반응형

vue-router 3.5.1 경고: 의 태그 프로포트가 사용되지 않으며 Vue Router 4에서 제거되었습니다.

Vue.js 앱의 노드 패키지를 업데이트했으므로 브라우저 콘솔에 다음 경고가 표시됩니다.

[ vue - router ]의 태그 프로포드는 폐지되어 Vue Router 4에서 삭제되었습니다.v-ipsec API를 사용하여 https://next.router.vuejs.org/guide/migration/#sec-of-event-and-tag-tag-in-sec-link 주의를 제거합니다.@ vue-sysm.esm.disc:16

정보는 아주 간단하지만

단 한 곳에서요<router-link>사용 중, 폐지된tag소품도 적용되지 않습니다.

<router-link
    class="button-add"
    :to="{
        name: 'ItemEditorAdd',
        params: { parent_item_id: item.id },
    }"
    :id="'button-' + item.id"
>
    <i class="material-icons">add</i>
</router-link>

또한 설치된 vue-router 패키지는 버전 4에 있는 것이 아니라 버전 3에 있으며, 이는 v2.6에 설치된 vue.js와 정확하게 일치합니다.그러나 이 경고 메시지는 호환성 검사기가 v4가 사용 중인 것으로 가정하고 있다는 인상을 줍니다.

패키지에서 발췌.json:

"vue": "^2.6.12",
"vue-class-component": "^7.2.6",
"vue-cookies-ts": "^1.5.19",
"vue-i18n": "^8.24.4",
"vue-property-decorator": "^9.1.2",
"vue-router": "^3.5.1",
"vuex": "^3.6.2",
"vuex-class": "^0.3.2",
"vuex-oidc": "^3.10.2"

StackOverflow 또는 vue-router Github 문제에서 솔루션을 찾을 수 없었습니다.
이 경고는 수정할 수 없는 것이 아니라 향후 업그레이드 시 이 점을 항상 염두에 두어야 합니까?이 경우 왜 체크하지 않는가?tag소품은 정말 사용되고 있습니다.좀 스팸적인 것 같습니다.

갱신하다
vue-router v3.5.2에서도 문제가 발생합니다.
GitHub vue-router 문제(닫힘)와 GitHub 부스트랩-vue 문제(열림)가 있습니다.

GitHub boostrap-vue 문제 코멘트에서 답을 찾았습니다.

이 문제는 #6374에 의해 수정되었으며 다음 마이너 버전(2.22.0)에 표시됩니다.
이 PR은 BLink 및 유사한 컴포넌트에서 이벤트 및 태그 소품을 실제로 사용하는 사용자를 제외한 대부분의 사용자에 대한 경고를 해결합니다.

bootstrap-vue 2.22.0은 아직 출시되지 않았습니다.현재 최신 릴리스는 2021년 1월부터 v2.21.2입니다.

AFAIK는 현재 이 경고에 대한 해결책이 없습니다.event그리고.tag특성.

방금 코드를 확인했는데 태그에 기본값이 설정되어 있습니다.

tag: {
      type: String,
      default: 'a'
    },

태그 확인 중 경고 표시이건 말도 안 돼요. 제거할 때까지 기다려야 해요.

if ('tag' in this.$options.propsData && !warnedTagProp) {
        warn(
          false,
          `<router-link>'s tag prop is deprecated and has been removed in Vue Router 4. Use the v-slot API to remove this warning: https://next.router.vuejs.org/guide/migration/#removal-of-event-and-tag-props-in-router-link.`
        )
        warnedTagProp = true
      }

이 문제를 해결하려면 https://next.router.vuejs.org/guide/migration/ #http://https://next.router.vuejs.org/guide/migration/ #http-of-http://http://http://https://next.router.vuejs.org/guide/migration/ 를 참조해 주세요.

<router-link
    class="button-add"
    :to="{
        name: 'ItemEditorAdd',
        params: { parent_item_id: item.id },
    }"
    :id="'button-' + item.id"
    custom
    :slot="{ navigate }"
>
    <i class="material-icons" @click="navigate" @keypress.enter="navigate" role="link">add</i>
</router-link>

그들의 이상한 체크가 스스로 디폴트값을 설정했기 때문에 경고를 보내는 것을 멈출 수 있을지 아직 100% 확신할 수 없다.위의 코드를 적용한 후에도 경고가 계속 표시될 경우 경고일 뿐이며 실제 가동 환경 이외의 환경에서만 표시되므로 걱정할 필요가 없습니다.

언급URL : https://stackoverflow.com/questions/67531261/warning-in-vue-router-3-5-1-router-links-tag-prop-is-deprecated-and-has-been

반응형