Editor.md 的简单使用

Editor.md 的使用

1. 从官网下载相应的组件

editorMd.PNG

2. 在页面中使用

            
            
            





var content = $('.editormd-markdown-textarea').val(); 获取值

• 后端接受图片

    //发布项目后改为项目地址
    private static String UPLOADED_FOLDER = "F:\\ideaTest\\gakki\\src\\main\\webapp\\image\\";

    @RequestMapping("/uploadimg")
    public Map editormdPic(@RequestParam(value = "editormd-image-file", required = false) MultipartFile file, HttpServletRequest request) throws Exception {
        Map resultMap = new HashMap<>();
        String fileName = file.getOriginalFilename();// 获取文件名
        String suffixName = fileName.substring(fileName.lastIndexOf("."));// 获取文件的后缀
        String newFileName = DateUtil.getCurrentDateStr() + suffixName;
        try {
            FileUtils.copyInputStreamToFile(file.getInputStream(),
                    new File(UPLOADED_FOLDER + newFileName));
            resultMap.put("success", 1);
            resultMap.put("message", "上传成功！");
            resultMap.put("url", "http://localhost:8888/image/" + newFileName);
        } catch (Exception e) {
            resultMap.put("success", 0);
            resultMap.put("message", "上传失败！");
            e.printStackTrace();
        }

        return resultMap;
    }

前段显示

    
    
    
    
    
    
    
    
    
    
    
    



    ${md.content }