管理システムで画像を表示および変更する場合

1：写真の表示

リストページに追加

 {
    
    
                    field: 'cityImg',
                    title: '城市图片',
                    formatter: function (value, row, index) {
    
    
                        console.log("aa"+value);
                        return '<img src="http://localhost:8080/ShadowLine/'+value+'" width="150" height="100">';
                    }

                },

私のパスはネットワークパスであり、ローカル絶対パスへの変更は成功しなかったことに注意してください。

2：写真をアップロードする

ここに画像の説明を挿入
コードを生成するときは、画像列のコードでアップロードコントロールを選択します。

 <div class="form-group">
            <label class="col-sm-3 control-label">电影图片：</label>
            <div class="col-sm-8">
                <input type="hidden" name="filmImg" th:field="*{filmImg}">
                <div class="file-loading">
                    <input class="form-control file-upload" id="filmImg" name="file" type="file">
                </div>
            </div>
        </div>

 $(".file-upload").each(function (i) {
    
    
        var val = $("input[name='" + this.id + "']").val()
        $(this).fileinput({
    
    
            'uploadUrl': ctx + 'common/upload1',
            initialPreviewAsData: true,
            initialPreview: [val],
            maxFileCount: 1,
            autoReplace: true
        }).on('fileuploaded', function (event, data, previewId, index) {
    
    
            $("input[name='" + event.currentTarget.id + "']").val(data.response.url)
        }).on('fileremoved', function (event, id, index) {
    
    
            $("input[name='" + event.currentTarget.id + "']").val('')
        })
        $(this).fileinput('_initFileActions');
    });

このフレームワークにファイルアップロードメソッドが付属している場合。
CommonController内

/ ***
共通アップロードリクエスト
/
@PostMapping（ "/ common / upload"）
@ResponseBody
public AjaxResult uploadFile（MultipartFile file）throws Exception
{ try { /

*
*この場所はアップロードのみを担当し、保存と保存は担当しません。特定のビジネスでは、この場所でテストするのは役に立たない
*
///ファイルパスをアップロードする
StringfilePath= "D：\ Environment \ worksheet \ ShadowLine \ WebContent \ imgs \ city \ cityImg \";
System.out.println（ "アップロード画像のパスは次のとおりです。"+filePath）;
//新しいファイル名をアップロードして返します
StringfileName = FileUploadUtils.upload（filePath、file）;

        System.out.println("上传图片的名字是:"+fileName);
        String url = "imgs/city/cityImg/"+fileName;
        System.out.println("url是"+url);//这个地方是存在数据库里图片的那个字段
        AjaxResult ajax = AjaxResult.success();
        ajax.put("fileName", fileName);
        ajax.put("url", url);
        return ajax;
    }
    catch (Exception e)
    {
        return AjaxResult.error(e.getMessage());
    }
}

効果画像：
ここに画像の説明を挿入