vue-quill-editor 使用

news2024/11/15 13:43:39

vue-quill-editor

安装

npm install vue-quill-editor -S

使用

.....
    <quill-editor
        style="padding-left: 0;padding-top: .0px;margin-top: 30px;"
        ref="editorRef" 
        v-model="params.content" class="ql-editor" 
        :options="editorOption"
        @blur="onEditorBlur($event)" 
        @focus="onEditorFocus($event)" 
        @change="onEditorChange($event)" 
      />
......

import { quillEditor } from 'vue-quill-editor'
// 上传至oss
import { uploadOss } from '@/api/uploadOss'
import 'quill/dist/quill.core.css'
import 'quill/dist/quill.snow.css'
import 'quill/dist/quill.bubble.css'
var sizes = [false, "16px", "18px", "20px", "22px", "26px", "28px", "30px"];

......
components: {
    quillEditor
  },
data(){
return{
	editorOption: {
	        modules: {
	          toolbar: {
	            container: [
	              ['bold', 'italic', 'underline', 'strike'], // 加粗 斜体 下划线 删除线
	              ['blockquote', 'code-block'], // 引用  代码块
	              [{ header: 1 }, { header: 2 }], // 1、2 级标题
	              [{ list: 'ordered' }, { list: 'bullet' }], // 有序、无序列表
	              [{ script: 'sub' }, { script: 'super' }], // 上标/下标
	              [{ indent: '-1' }, { indent: '+1' }], // 缩进
	              [{ direction: 'rtl' }], // 文本方向
	              [{ size: sizes }], // 字体大小
	              [{ header: [1, 2, 3, 4, 5, 6,false] }], // 标题
	              [{ color: [] }, { background: [] }], // 字体颜色、字体背景颜色
	              // [{ font: ['songti'] }], // 字体种类
	              [{ align: [] }], // 对齐方式
	              ['clean'], // 清除文本格式
	              ['image', 'video'] // 链接、图片、视频
	            ],
	            handlers: {
	              image: this.imageUploadOss
	            }
	          },
	        placeholder: '请输入正文'
	      },
}
}
....
methods:{
// 失去焦点事件
    onEditorBlur(quill) {
    },
    // 获得焦点事件
    onEditorFocus(quill) {
    },
    // 准备富文本编辑器
    onEditorReady(quill) {
    },
    // 内容改变事件
    onEditorChange({ quill, html, text }) {
      this.params.content = html
    },
}

图片拖拽及图片缩放

安装

npm i quill-image-drop-module -S
npm i quill-image-resize-module -S

使用

1. 新增样式文件.css

目录： assets/styles/quillEditor.css

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=SimHei]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=SimHei]::before {
  content: "黑体";
  font-family: "SimHei";
}

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=Microsoft-YaHei]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=Microsoft-YaHei]::before {
  content: "微软雅黑";
  font-family: "Microsoft YaHei";
}

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=KaiTi]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=KaiTi]::before {
  content: "楷体";
  font-family: "KaiTi";
}

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=FangSong]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=FangSong]::before {
  content: "仿宋";
  font-family: "FangSong";
}

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=Arial]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=Arial]::before {
  content: "Arial";
  font-family: "Arial";
}

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=Times-New-Roman]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=Times-New-Roman]::before {
  content: "Times New Roman";
  font-family: "Times New Roman";
}

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=sans-serif]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=sans-serif]::before {
  content: "sans-serif";
  font-family: "sans-serif";
}

.ql-font-SimSun {
  font-family: "SimSun";
}

.ql-font-SimHei {
  font-family: "SimHei";
}

.ql-font-Microsoft-YaHei {
  font-family: "Microsoft YaHei";
}

.ql-font-KaiTi {
  font-family: "KaiTi";
}

.ql-font-FangSong {
  font-family: "FangSong";
}

.ql-font-Arial {
  font-family: "Arial";
}

.ql-font-Times-New-Roman {
  font-family: "Times New Roman";
}

.ql-font-sans-serif {
  font-family: "sans-serif";
}

/* 字号设置 */
/* 默认字号 */
.ql-snow .ql-picker.ql-size .ql-picker-label::before,
.ql-snow .ql-picker.ql-size .ql-picker-item::before {
  content: "14px";
}

.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="14px"]::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="14px"]::before {
  content: "14px";
  font-size: 14px;
}

.ql-size-14px {
  font-size: 14px;
}

.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="16px"]::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="16px"]::before {
  content: "16px";
  font-size: 16px;
}

.ql-size-16px {
  font-size: 16px;
}

.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="18px"]::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="18px"]::before {
  content: "18px";
  font-size: 18px;
}

.ql-size-18px {
  font-size: 18px;
}

.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="20px"]::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="20px"]::before {
  content: "20px";
  font-size: 20px;
}

.ql-size-20px {
  font-size: 20px;
}

.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="22px"]::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="22px"]::before {
  content: "22px";
  font-size: 22px;
}

.ql-size-22px {
  font-size: 22px;
}

.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="26px"]::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="26px"]::before {
  content: "26px";
  font-size: 26px;
}

.ql-size-26px {
  font-size: 26px;
}

.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="28px"]::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="28px"]::before {
  content: "28px";
  font-size: 28px;
}

.ql-size-28px {
  font-size: 28px;
}

.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="30px"]::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="30px"]::before {
  content: "30px";
  font-size: 30px;
}

.ql-size-30px {
  font-size: 30px;
}
2.配置及使用
// vue.config.js 中增加
const webpack = require('webpack');
new webpack.ProvidePlugin({
	'window.Quill': 'quill/dist/quill.js',
   'Quill': 'quill/dist/quill.js'
 })

// 新建的css文件的保存位置，如不同，需要修改
import "@/assets/styles/quillEditor.css";
import imageResize  from 'quill-image-resize-module'
Quill.register('modules/imageResize', imageResize )
import { ImageDrop } from 'quill-image-drop-module'
Quill.register('modules/imageDrop', ImageDrop)

// 调整字体大小选项
var sizes = [false, "16px", "18px", "20px", "22px", "26px", "28px", "30px"];
var Size = Quill.import("formats/size");
Size.whitelist = sizes;
Quill.register(Size, true)

// toobar同级增加,如下图
imageDrop: true, // 拖动加载图片组件。
imageResize: { //调整大小组件。
    displayStyles: {
        backgroundColor: 'black',
        border: 'none',
        color: 'white'
    },
    modules: [ 'Resize', 'DisplaySize', 'Toolbar' ]
}

在这里插入图片描述

视图效果

在这里插入图片描述

完整代码

<template>
  <div class="app-container" style="min-height: calc(100vh - 50px);">
    <el-tabs v-model="params.type" @tab-click="tabClick">
      <el-tab-pane label="医院简介" name="BRIEF" />
      <el-tab-pane label="楼宇分布" name="BUILDING" />
      <el-tab-pane label="科室分布" name="DEPARTMENT" />
    </el-tabs>
    <div style="position: relative;margin-top: 10px;">
      <span style="display: block;position: absolute;top: 10px;padding-left: 18px;box-sizing: border-box;">
       <a style="font-size: 40px;color: red;position: absolute;left: 0;top: -5px;">*</a>介绍内容
      </span>
    </div>
    <quill-editor
        style="padding-left: 0;padding-top: .0px;margin-top: 30px;"
        ref="editorRef" 
        v-model="params.content" class="ql-editor" 
        :options="editorOption"
        @blur="onEditorBlur($event)" 
        @focus="onEditorFocus($event)" 
        @change="onEditorChange($event)" 
      />
      <div style="width: 100%;text-align: center;">
        <el-button style="width: 100px;" icon="el-icon-delete"  @click="() => params.content = ''">清空</el-button>
        <el-button style="width: 100px;" icon="el-icon-tickets" :loading="loading" type="primary" @click="saveContent()"
        v-if="checkPer(['admin', 'unicameral:introduce:edit'])" 
        >保存</el-button>
      </div>
  </div>
</template>
  
<script>
import { Notification, Loading } from 'element-ui'
import { quillEditor } from 'vue-quill-editor'
import { uploadOss } from '@/api/uploadOss'
import * as introduceService from '@/api/unicameral/introduceService'
import 'quill/dist/quill.core.css'
import 'quill/dist/quill.snow.css'
import 'quill/dist/quill.bubble.css'
// 新建的css文件的保存位置，如不同，需要修改
import "@/assets/styles/quillEditor.css";
import imageResize  from 'quill-image-resize-module'
Quill.register('modules/imageResize', imageResize )
import { ImageDrop } from 'quill-image-drop-module'
Quill.register('modules/imageDrop', ImageDrop)

var sizes = [false, "16px", "18px", "20px", "22px", "26px", "28px", "30px"];
var Size = Quill.import("formats/size");
Size.whitelist = sizes;
Quill.register(Size, true)

export default {
  name: 'UnicameralIntroduce',
  components: {
    quillEditor
  },
  data() {
    return {
      params: {
        hosId: '',
        type: 'BRIEF',
        content: ''
      },
      loading: false,
      editorOption: {
        modules: {
          toolbar: {
            container: [
              ['bold', 'italic', 'underline', 'strike'], // 加粗 斜体 下划线 删除线
              ['blockquote', 'code-block'], // 引用  代码块
              [{ header: 1 }, { header: 2 }], // 1、2 级标题
              [{ list: 'ordered' }, { list: 'bullet' }], // 有序、无序列表
              [{ script: 'sub' }, { script: 'super' }], // 上标/下标
              [{ indent: '-1' }, { indent: '+1' }], // 缩进
              [{ direction: 'rtl' }], // 文本方向
              [{ size: sizes }], // 字体大小
              [{ header: [1, 2, 3, 4, 5, 6,false] }], // 标题
              [{ color: [] }, { background: [] }], // 字体颜色、字体背景颜色
              // [{ font: ['songti'] }], // 字体种类
              [{ align: [] }], // 对齐方式
              ['clean'], // 清除文本格式
              ['image', 'video'] // 链接、图片、视频
            ],
            handlers: {
              image: this.imageUploadOss
            }
          },
          imageDrop: true, // 拖动加载图片组件。
          imageResize: { //调整大小组件。
              displayStyles: {
                  backgroundColor: 'black',
                  border: 'none',
                  color: 'white'
              },
              modules: [ 'Resize', 'DisplaySize', 'Toolbar' ]
          }
        },
        placeholder: '请输入正文'
      },
    }
  },
  mounted() {
    this.getContent()
  },
  methods: {
    tabClick() {
      // 清空内容
      this.params.content = ''
      this.getContent()
    },
    // 失去焦点事件
    onEditorBlur(quill) {
    },
    // 获得焦点事件
    onEditorFocus(quill) {
    },
    // 准备富文本编辑器
    onEditorReady(quill) {
    },
    // 内容改变事件
    onEditorChange({ quill, html, text }) {
      this.params.content = html
    },
    getContent() {
      const options = {
            fullscreen: false,
            target: document.querySelector('.platform-wrap')
        }
      const loadingInstance = Loading.service(options)
      this.params.content = ""
      introduceService.getIntroduce(this.params).then(res => {
        if(res.status == '200'){
          this.params.content = res.result
        }
      }).finally(() => loadingInstance.close())
    },
    saveContent() {
      this.loading = true;
      introduceService.saveIntroduce(this.params).then(res => {
        if(res.status == '200'){
          Notification.success('操作成功')
        }else {
          Notification.error('操作成功')
        }
      }).finally(() => this.loading = false)
    },
    imageUploadOss() {
      const { quill } = this.$refs.editorRef
      let fileInput = quill.container.querySelector('input.ql-image[type=file]')
      if (fileInput === null) {
        fileInput = document.createElement('input')
        fileInput.setAttribute('type', 'file')
        // 设置图片参数名
        fileInput.setAttribute('name', 'file')
        // 可设置上传图片的格式
        fileInput.setAttribute('accept', 'image/png, image/gif, image/jpeg, image/bmp, image/x-icon')
        fileInput.classList.add('ql-image')
        // 监听选择文件
        fileInput.addEventListener('change', function() {
          const formData = new FormData()
          formData.append('file', fileInput.files[0])
          formData.append('imageUrl', 'hos/unicameral-introduce/')
          uploadOss(formData).then(res => {
            if (res.status === '200') {
              const length = quill.getSelection(true).index
              quill.insertEmbed(length, 'image', process.env.VUE_APP_DOMAIN_STATIC + res.result)
              quill.setSelection(length + 1)
            }
          }).catch(err => {
            console.log(err)
            Notification.error('图片上传失败')
          })
        })
      }
      fileInput.click()
    },
    imageUpload() {
      // var self = this
      const { quill } = this.$refs.editorRef
      let fileInput = quill.container.querySelector('input.ql-image[type=file]')
      if (fileInput === null) {
        fileInput = document.createElement('input')
        fileInput.setAttribute('type', 'file')
        // 设置图片参数名
        fileInput.setAttribute('name', 'file')
        // 可设置上传图片的格式
        fileInput.setAttribute('accept', 'image/png, image/gif, image/jpeg, image/bmp, image/x-icon')
        fileInput.classList.add('ql-image')
        // 监听选择文件
        fileInput.addEventListener('change', () => {
          const formData = new FormData()
          formData.append('file', fileInput.files[0])
          // let length = self.quill.getSelection(true).index;
          // quill.insertEmbed(length, 'image', data.data.data.url);
          // quill.insertEmbed(length, 'title', data.data.data.fileName);
          // quill.setSelection(length + 1)
        })
        quill.container.appendChild(fileInput)
      }
      fileInput.click()
    }
  }
}
</script>
<style scoped lang="scss">
.codeJs {
  font-size: 11pt;
  font-family: Consolas, Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace, serif;
}
::v-deep .el-tabs {
    margin-bottom: 0px;
}
// ::v-deep .ql-editor{
// height:260px;
// }
</style>
<style>
.CodeMirror-hints{
  z-index: 8888!important;
}
</style>

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.coloradmin.cn/o/1234658.html

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

PG数据中DBeaver上传csv文件作为数据表

PG数据中DBeaver上传csv文件作为数据表

DBeaver 是一个开源的数据库工具&#xff0c;还是蛮好用的&#xff0c;有时候需要我们上传数据做表&#xff0c;数据为CSV格式的&#xff0c;DBeaver本身自带有功能实现的。 可打开连着的数据库&#xff0c;找到模式&#xff0c;点到下面的表里&#xff0c;选择一个表直接导入…
阅读更多...
【Java】乡镇卫生院、社区卫生服务中心云HIS源码

【Java】乡镇卫生院、社区卫生服务中心云HIS源码

云HIS采用云端SaaS服务的方式提供&#xff0c;用户通过浏览器即能访问&#xff0c;无需关注系统的部署、维护、升级等问题&#xff0c;系统充分考虑了模板化、配置化、智能化、扩展化等设计方法&#xff0c;覆盖了基层医院机构的主要工作流程&#xff0c;能够与监管系统有序对接…
阅读更多...
Golang基础-面向对象篇

Golang基础-面向对象篇

文章目录 struct结构体类的表示与封装类的继承多态的基本要素与实现interface空接口反射变量的内置pairreflect包解析Struct TagStruct Tag在json中的应用 struct结构体 在Go语言中&#xff0c;可以使用type 关键字来创建自定义类型&#xff0c;这对于提高代码的可读性和可维护…
阅读更多...
安防监控视频云存储平台EasyCVR页面播放卡顿的优化方法

安防监控视频云存储平台EasyCVR页面播放卡顿的优化方法

视频监控平台EasyCVR能在复杂的网络环境中&#xff0c;将分散的各类视频资源进行统一汇聚、整合、集中管理&#xff0c;在视频监控播放上&#xff0c;TSINGSEE青犀视频安防监控汇聚平台可支持1、4、9、16个画面窗口播放&#xff0c;可同时播放多路视频流&#xff0c;也能支持视…
阅读更多...
Milvus 2.3.功能全面升级，核心组件再升级，超低延迟、高准确度、MMap一触开启数据处理量翻倍、支持GPU使用！

Milvus 2.3.功能全面升级，核心组件再升级，超低延迟、高准确度、MMap一触开启数据处理量翻倍、支持GPU使用！

Milvus 2.3.功能全面升级&#xff0c;核心组件再升级&#xff0c;超低延迟、高准确度、MMap一触开启数据处理量翻倍、支持GPU使用&#xff01; 1.Milvus 2.3版本全部升级简介 Milvus 2.3.0 不仅包含大量的社区呼声很高的新功能&#xff0c;还带来了诸如 GPU 支持、Query 架构…
阅读更多...
使用Python处理ADC激光测距数据并绘制为图片(二)

使用Python处理ADC激光测距数据并绘制为图片(二)

使用Python处理ADC激光测距数据并绘制为图片 说明一、定义全局变量变二、保存和清空原始数据三、拆分原始数据为键值对四、获取标题、FigText、更新统计信息文件五、生成图片六、处理原始数据文件七、主函数入口八、测试结果 说明 1. 主要是将ADC激光测距叠加后的1024Byte数据绘…
阅读更多...
vue-admin-template改变接口地址

vue-admin-template改变接口地址

修改登录接口 1.f12查看请求接口 模仿返回数据写接口 修改方式1 1.在env.devolopment修改 修改方式2 vue.config.js 改成本地接口地址 配置转发 后端创建相应接口&#xff0c;使用map返回相同的数据 修改前端请求路径 修改前端返回状态码 utils里面的request.js
阅读更多...
Joern安装与使用

Joern安装与使用

环境准备 Joern需要在Linux环境中运行&#xff0c;所以在Windows系统中需要借助WSL或虚拟机安装。 JDK安装 Joern的运行需要JAVA环境的支持&#xff0c;本次采用的是JDK17&#xff0c;其他版本建议看一下Joern官方文档。 apt install openjdk-17-jre-headless 配置JAVA环境变…
阅读更多...
集成仿真软件 PLEXOS 9.0 授权永久完美

集成仿真软件 PLEXOS 9.0 授权永久完美

PLEXOS是由能源示例发布的能源市场集成仿真软件。能源市场是一个充满活力和活力的市场&#xff0c;在这个大市场中有各种各样的数据和信息模型。观看每日市场发展和大量数据可能会使您感到困惑&#xff0c;并难以进行未来的投资和分析。使用集成和全面的方法是应对这一挑战的唯…
阅读更多...
【深度学习实验】注意力机制（四）：点积注意力与缩放点积注意力之比较

【深度学习实验】注意力机制（四）：点积注意力与缩放点积注意力之比较

文章目录 一、实验介绍二、实验环境1. 配置虚拟环境2. 库版本介绍 三、实验内容0. 理论介绍a. 认知神经学中的注意力b. 注意力机制 1. 注意力权重矩阵可视化&#xff08;矩阵热图&#xff09;2. 掩码Softmax 操作3. 打分函数——加性注意力模型3. 打分函数——点积注意力与缩放…
阅读更多...
ky10 server aarch64 离线安装openssl3.1.4

ky10 server aarch64 离线安装openssl3.1.4

离线程序 https://gitcode.net/zengliguang/ky10_aarch64_openssl_install.git 输入下面命令执行离线安装脚本 source openssl_offline_install.sh 安装完成
阅读更多...
仪表盘：pyecharts绘制

仪表盘：pyecharts绘制

一、仪表盘 在数据分析中&#xff0c;仪表盘图&#xff08;dashboard&#xff09;的作用是以一种简洁、图表化的方式呈现数据的关键指标和核心信息&#xff0c;以帮助用户快速理解数据的情况&#xff0c;并从中提取关键见解。 仪表盘图通常由多个图表、指标和指示器组成&…
阅读更多...
南京--ChatGPT/GPT4 科研实践应用

南京--ChatGPT/GPT4 科研实践应用

2023年随着OpenAI开发者大会的召开&#xff0c;最重磅更新当属GPTs&#xff0c;多模态API&#xff0c;未来自定义专属的GPT。微软创始人比尔盖茨称ChatGPT的出现有着重大历史意义&#xff0c;不亚于互联网和个人电脑的问世。360创始人周鸿祎认为未来各行各业如果不能搭上这班车…
阅读更多...
杨氏矩阵解法

杨氏矩阵解法

每日一言 「 人生如逆旅&#xff0c;我亦是行人。 」--临江仙送钱穆父-苏轼题目 杨氏矩阵 有一个数字矩阵&#xff0c;矩阵的每行从左到右是递增的&#xff0c;矩阵从上到下是递增的&#xff0c;请编写程序在这样的矩阵中查找某个数字是否存在。 解法思路 法一&#xff1a;…
阅读更多...
Vue3 provide 和 inject 实现祖组件和后代组件通信

Vue3 provide 和 inject 实现祖组件和后代组件通信

provide 和 inject 能够实现祖组件和其任意的后代组件之间通信&#xff1a; 一、provide 提供数据 我们在祖组件中使用provide 将数据提供出去。 使用provide 之前需要先进行引入&#xff1a; import { provide } from "vue"; 语法格式如下&#xff1a; provide(&q…
阅读更多...
米哈游大数据云原生实践

米哈游大数据云原生实践

云布道师 近年来&#xff0c;容器、微服务、Kubernetes 等各项云原生技术的日渐成熟&#xff0c;越来越多的公司开始选择拥抱云原生&#xff0c;并将企业应用部署运行在云原生之上。随着米哈游业务的高速发展&#xff0c;大数据离线数据存储量和计算任务量增长迅速&#xff0c…
阅读更多...
SqlServer_idea连接问题

SqlServer_idea连接问题

问题描述&#xff1a; sqlServer安装之后可以使用navicat进行连接idea使用账户密码进行登录连接失败 问题解决&#xff1a; 先使用sqlServer管理工具进行登录 使用window认证连接修改账户密码 启用该登录名 这时idea还是无法连接&#xff0c;还需要如下配置 打开sqlserve…
阅读更多...
论文阅读：“基于特征检测与深度特征描述的点云粗对齐算法”

论文阅读：“基于特征检测与深度特征描述的点云粗对齐算法”

文章目录 摘要简介相关工作粗对齐传统的粗对齐算法基于深度学习的粗对齐算法 特征检测及描述符构建 本文算法ISS 特征检测RANSAC 算法3DMatch 算法 实验结果参考文献 摘要 点云对齐是点云数据处理的重要步骤之一&#xff0c;粗对齐则是其中的难点。近年来&#xff0c;基于深度…
阅读更多...
java项目之社区互助平台（ssm+vue）

java项目之社区互助平台（ssm+vue）

项目简介 社区互助平台实现了以下功能&#xff1a; 1、一般用户的功能及权限 所谓一般用户就是指还没有注册的过客,他们可以浏览主页面上的信息。但如果有中意的社区互助信息时&#xff0c;要登录注册&#xff0c;只有注册成功才有的权限。2、管理员的功能及权限 用户信息的添…
阅读更多...
第十一章 目标检测中的NMS

第十一章 目标检测中的NMS

精度提升 众所周知&#xff0c;非极大值抑制NMS是目标检测常用的后处理算法&#xff0c;用于剔除冗余检测框&#xff0c;本文将对可以提升精度的各种NMS方法及其变体进行阶段性总结。 总体概要&#xff1a; 对NMS进行分类&#xff0c;大致可分为以下六种&#xff0c;这里是依…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023