vue之Missing required prop: "id"
阿新 • • 發佈:2021-08-02
在我們常見的點選編輯後跳轉到詳細資訊頁面中遇到這個報錯,通過查資料得知是由於在元件中定義了value屬性,但是在呼叫元件時,卻沒有傳這個值,結合我的程式碼,得出是由於我在使用router路由跳轉時,在路由中寫了目標頁面的id值,但卻沒有在配置路由時新增props: true 。導致子元件無法從父元件中獲取所需要的值。
正確程式碼如下:
子元件:
<create-or-updateisEdit:courseId="courseId"></create-or-update>
父元件:
<el-button@click="$router.push({ name:'update-course',路由:
{ path:'/course/:courseId/update', name:'update-course', component:()=>import(/*webpackChunkName:course-update*/'@/views/course/update'), props:true }拓展:路由之props: true
當在routes中設定props:ture時,我們在元件中可以通過 props: ['id']獲取路由中的引數(id引數)值
當props:false是無法獲取的。
如果我們不使用props屬性,那麼我們只能通過傳統的方式在元件中獲取引數資料
那麼傳統的方式為{{ $route.params.id }}
那麼傳統的方式就是在元件中用到了路由物件,那麼元件就和路由耦合了。