![](/img/trans.png)
[英]Uncaught TypeError: Cannot read property 'uid' of undefined
[英]Uncaught (in promise) TypeError: Cannot read property 'uid' of undefined
我正在使用laravel 5.4和Vue.js 2在DB中保存一些信息和文件(視頻)。但是我得到了這樣的錯誤
錯誤: http : //imgur.com/a/7XGERPUT
http://localhost:8000/videos/null 404 (Not Found)
未捕獲(承諾)TypeError:無法讀取未定義的屬性'uid'
NotFoundHttpException in Handler.php line 131:
No query results for model [App\Models\Video].
路線:
Route::group(['middleware'=>['auth']],function(){
Route::get('/upload','VideoUploadController@index');
Route::post('/videos','VideoController@store');
Route::put('/videos/{video}','VideoController@update');
Route::get('/channel/{channel}/edit','ChannelSettingsController@edit');
Route::put('/channel/{channel}/edit','ChannelSettingsController@update');
});
的Controler:
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\Http\Requests\VideoUpdateRequest;
use App\Models\Video;
class VideoController extends Controller
{
public function store(Request $request)
{
$uid = uniqid(true);
$channel = $request->user()->channel()->first();
$video = $channel->video()->create([
'uid'=>$uid,
'title'=>$request->title,
'description'=>$request->description,
'visibility'=>$request->visibility,
'video_filename'=>"{$uid}.{$request->extension}",
]);
return response()->json([
'data' => [
'uid' => $uid
]
]);
}
public function update(VideoUpdateRequest $request, Video $video)
{
//authentication checked here .......
$video->update([
'title' => $request->title,
'description' => $request->description,
'visibility' => $request->visibility,
'allow_votes' => $request->has('allow_votes'),
'allow_comments' => $request->has('allow_comments')
]);
if ($request->ajax()) {
return response()->json(null, 200);
}
return redirect()->back();
}
}
Uplod.vue
<template>
<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2">
<div class="panel panel-default">
<div class="panel-heading">Example Component</div>
<div class="panel-body">
<input type="file" name="video" id="video" @change="changfileInputChange" v-if="!uploading">
<div id="video-form" v-if="uploading&&!failed">
<div class="form-group">
<label for="title">Title</label>
<input type="" name="" v-model="title" class="form-control">
</div>
<div class="form-group">
<label for="description">Description</label>
<textarea class="form-control"v-model="description"></textarea>
</div>
<div class="form-group">
<label for="visibility">Visibility</label>
<select class="form-control" v-model="visibility">
<option value="private">Private</option>
<option value="public">Public</option>
<option value="unlisted">Unlisted</option>
</select>
</div>
<span class="help-block pull-right">{{saveStatus}}</span>
<button class="btn btn-default" type="submit"@click.prevent="update">Save changes</button>
</div>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
mounted() {
console.log('Component mounted.')
},
data()
{
return{
uid:null,
uploading:false,
uplodComplete:false,
failed:false,
title:'unlisted',
description:null,
visibility:'private',
saveStatus:null
}
},
methods:{
changfileInputChange()
{
this.uploading=true;
this.failed=false;
this.file=document.getElementById('video').files[0];
this.storeVideo().then(()=>{
})
},
storeVideo(){
return this.$http.post('/videos',{
title:this.title,
description:this.description,
visibility:this.visibility,
extension:this.file.name.split('.').pop()
}).then((response)=>{
this.uid = response.json().data.uid;
});
},
update() {
this.saveStatus = 'Saving changes.';
return this.$http.put('/videos/' + this.uid, {
title: this.title,
description: this.description,
visibility: this.visibility
}).then((response) => {
this.saveStatus = 'Changes saved.';
setTimeout(() => {
this.saveStatus = null
}, 3000)
}, () => {
this.saveStatus = 'Failed to save changes.';
});
}
}
}
</script>
首先我將視頻保存到數據庫以及帶有ajax請求的標題,描述等的一些默認值,請參閱Video.vue代碼
我在商店方法的控制台中獲取uid
(視頻的唯一ID)但是當我通過單擊保存chages按鈕更新時,我得到如下錯誤:
當我在控制器中使用我的默認uid
時
public function store(Request $request)
{
$uid = '158cfff622e1b7';
//....some code here
//finally return $uid
return response()->json([
'data' => [
'uid' => $uid
]
]);
}
並且在此行中的Upload.vue
中,如果我將uid
更改為默認值158cfff622e1b7
,它可以正常工作,即:結果更新
return this.$http.put('/videos/' +'158cfff622e1b7', {
//code
});
it means i am not getting `uid` ,or something is wrong,please help me
以下是錯誤的屏幕截圖: http : //imgur.com/a/7XGER
錯誤: PUT http://localhost:8000/videos/null 404 (Not Found)
我可以看到你正在使用路由模型綁定。
Route::put('/videos/{video}','VideoController@update');
路徑模型綁定使用ID
字段開箱即用。 如果使用其他密鑰,則需要告知模型使用該密鑰進行路由模型綁定。
在視頻模型中添加
public function getRouteKeyName() {
return 'uid';
}
更新
在providers / RouteServiceProvider中,在boot()
添加它
Route::bind('video', function ($value) {
return App\Models\Video::where('uid', $value)->first();
});
如果它仍然不起作用,只需獲取視頻並更新它,這是一個很好的方法
public function update(VideoUpdateRequest $request, $uid)
{
$video = Video::where('uid', $uid)->first();
$video->title = $request->title;
$video->description = $request->description;
...
$video->update();
if ($request->ajax()) {
return response()->json(null, 200);
}
return redirect()->back();
}
替換this this.uid = response.json().data.uid;
by this.uid = response.body.data.uid;
它必須工作,如果不讓我聽到
閱讀文檔了解更多信息
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.