caseEdit.vue

<template>
  <div id="case-edit">
    <div class="operation-btn">
      <div>取消</div>
      <div>预览</div>
      <div>发布</div>
    </div>
    <input class="title" type="text" placeholder="请输入标题" />
    <quill-editor ref="editor" :options="editorOption" @change="onEditorChange($event)"></quill-editor>
  </div>
</template>

<script>
import quillEditor from "@/components/quill";
export default {
  name: "case-edit",
  components: {
    quillEditor
  },
  data() {
    return {
      editorOption: {
        placeholder: '请输入内容',
        modules: {
          toolBar: {
          }
        }
      }
    };
  }
};
</script>

<style lang="scss">
#case-edit {
  .operation-btn {
    display: flex;
    justify-content: space-between;
    width: 100%;
    padding: 14px;
    font-size: 18px;
  }
  .title {
    margin: 10px;
    border-left: none;
    border-top: none;
    border-right: none;
    border-bottom: 0.5px solid #000;
    font-size: 18px;
  }
}
</style>