haidaralessa's avatar

Error in render: "TypeError: Cannot read property 'replace' of undefined"

Hello,

Code of component:

<el-upload
        :action="'/api/attendances/' + id + '/attachment'"
        name="file[]"
        :on-success="handleSuccess"
        :on-remove="handleRemove"
        :file-list="fileList">
        <el-button size="small" type="primary">Attach your Excuse</el-button>
        <div slot="tip" class="el-upload__tip">jpg/png files with a size less than 500kb</div>
</el-upload>
<script>
export default {
    props: {
        id: Number,
    },
    data() {
        return {
            fileList: [],
        }
    },
    methods: {
        handleRemove(file, fileList) {
            let vm = this
            axios.delete('/api/upload/' + file.uid)
                .then(function () {
                    let index = _.findIndex(vm.fileList, ['uid', file.uid])
                    vm.$delete(vm.fileList, index)
                })
                .catch(function (error) {
                    console.log(error);
                });
        },
        handleSuccess(response, file, fileList) {
            var vm = this
            _.map(response, function (data) {
                file['uid'] = data
            })
            vm.fileList = fileList;
            this.fileList = fileList;
        },
    }
}
   </script>

Code of Controller:

public function store(Request $request, Attendance $attendance)
{
    $att = Attendance::find($attendance->id);
    $uploadId = array();
    if ( $files =  $request->file('file')) {
        foreach ($request->file('file') as $key => $file) {
            $name = time() . $key . $file->getClientOriginalName();
            $filename = $file->move('files', $name);
            $uploadId[] = $att->attachment()->create([
                'name' => $name,
                'path' => $filename])->id;
        }
    }
    return response()->json($uploadId, 200);
}

Problem:

Uploading an image is stored correctly, but it doesn't show the image at the list.

This is the error got: Error in render: "TypeError: Cannot read property 'replace' of undefined"

Note: I'm using ElementUI for uploading the image.

Any tip, please.

0 likes
1 reply

Please or to participate in this conversation.