个人开发笔记

开发常见问题

Vue开发中页面flex滚动布局，内容置顶问题

直接操作路由：
const router = createRouter({
  routes: routes,
  history: createWebHashHistory(),
  scrollBehavior(to, from, saveTop) {
    if (saveTop) {
      return saveTop;
    } else {
      return { left: 0, top: 0 }
    }
  },
})

Vue3富文本编辑器的使用

<Toolbar :editor="editorRef"
               style="border: 1px solid #e5e7eb"
               :defaultConfig="toolbarConfig"
               :mode="'simple'" />
      <Editor style="height: 20rem; overflow-y: hidden; width: 100%;border: 1px solid #e5e7eb"
              v-model="ruleForm.questionContent"
              :value="ruleForm.questionContent"
              :defaultConfig="editorConfig"
              :mode="'default'"
              @onCreated="handleCreated"
          @onChange="handleChange" />

const toolbarConfig: Partial<IToolbarConfig> = {
  // 用于去掉不需要的工具栏配置
  excludeKeys: [
    "insertVideo", // 去掉插入视频功能
    "fullScreen", // 去掉全屏功能
  ],
}
const uploadImg = (file: { name: any; }, insertFn: (arg0: any, arg1: any, arg2: any) => void) => {
  const formData = new FormData()
  formData.append('file', file as any)
  uploadImgData(formData).then((e: {
      data: any; code: number
  }) => {
    if (e.code == 200) {
      insertFn(
        getBaseUrl()+e.data.url,
        file.name,
        getBaseUrl()+e.data.url,
      )
    }
  })
}
// 编辑器配置
const editorConfig: Partial<IEditorConfig> = {
  // 最长输入2000字
  maxLength: 2000,
  placeholder: "请输入内容...",
  // 进入页面不自动聚焦
  autoFocus: true,
  MENU_CONF: {
    uploadImage:{
      server: getBaseUrl() + '/common/upload',
      headers: { Authorization:Local.getStr('ACCESS_TOKEN') },
      fieldName: 'file',
      customUpload: uploadImg,
    }
  },
}
const ruleFormRef = ref<FormInstance>()
const editorRef = ref()

功能快捷键

撤销：Ctrl/Command + Z
重做：Ctrl/Command + Y
加粗：Ctrl/Command + B
斜体：Ctrl/Command + I
标题：Ctrl/Command + Shift + H
无序列表：Ctrl/Command + Shift + U
有序列表：Ctrl/Command + Shift + O
检查列表：Ctrl/Command + Shift + C
插入代码：Ctrl/Command + Shift + K
插入链接：Ctrl/Command + Shift + L
插入图片：Ctrl/Command + Shift + G
查找：Ctrl/Command + F
替换：Ctrl/Command + G