sdc-mce-editor

test

Project setup

npm install

Compiles and hot-reloads for development

npm run serve

Compiles and minifies for production

npm run build

Lints and fixes files

npm run lint

Customize configuration

<sdc-mce-editor ref="editor" :content="content" :catalogue="catalogue" :urlConfig="urlConfig" @catalogueVisible="catalogueVisible" @getWordCount="getWordCount"/>

    content 编辑器内容默认值，默认值为''，可传可不传
    options 编辑器配置，参考tinymce的api,可以不传，默认值为{
          selector: '#sdc__editor',
          menubar: false,
          block_formats: '标题1=h1; 标题2=h2; 标题3=h3; 正文=p',
          formats: {
            removeformat: [
              {
                selector:
                  'b,strong,em,i,font,u,strike,s,sub,sup,dfn,code,samp,kbd,var,cite,mark,q,del,ins,small',
                remove: 'all',
                split: true,
                block_expand: true,
                expand: false,
                deep: true
              },
              {
                selector: 'span',
                attributes: ['style', 'class'],
                remove: 'empty',
                split: true,
                expand: false,
                deep: true
              },
              {
                selector: '*',
                attributes: ['style', 'class'],
                split: false,
                expand: false,
                deep: true
              }
            ]
          },
          paste_data_images: true,
          plugins: [
            'noneditable advlist lists charmap paste print',
            'preview anchor visualblocks insertdatetime',
            'media table code wordcount formatpainter',
            'catalogue',
            'codesample'
          ],
          noneditable_noneditable_class: 'mceNonEditable',
          language: 'zh_CN',
          toolbar: `toc undo redo formatpainter removeformat | 
            catalogueBtn formatselect fontsizeselect lineheight |
            bold italic underline strikethrough |
            forecolor backcolor |
            dent align bullist numlist |
            insert |
            fullScreenButton copy`,
          toolbar_mode: 'wrap'
        }
    urlConfig 编辑器文件上传请求路径配置，必传，默认值为{
              operatesignature:
                'http://demo.ntsgw.oa.com/api/sso/content-center/api/v1/content/test/operatesignature',   获取鉴权
              uploadSignatures:
                'http://demo.ntsgw.oa.com/api/sso/content-center/api/v1/content/file/uploadSignatures',   上传
              contentinfo:
                'http://demo.ntsgw.oa.com/api/sso/content-center/api/v1/content/contentinfo',    获取内容id
              preview:
                'http://demo.ntsgw.oa.com/api/sso/content-center/api/v1/content/imgage/{contentId}/preview'  预览，{contentId}为占位符，我这边会将字符串替换为contentId
            }
    catalogue 是否显示目录，true为显示
    回调
    catalogueVisible  目录切换触发，false为显示
    getWordCount  字数改变触发，返回当前字数

<sdc-mce-preview :content="str" /> 文件预览组件

    content 为字符串，为预览内容
    urlConfig 预览请求路径配置，必传，默认值为{
              operatesignature:
                'http://dev-ntsgw.woa.com/api/sso/know-service/api/ql/common/content/operatesignature',
              contentinfo:
                'http://dev-ntsgw.woa.com/api/sso/content-center/api/v1/content/{contentId}',
              preview:
                'http://dev-ntsgw.woa.com/api/sso/content-center/api/v1/content/imgage/{contentId}/preview'  预览，{contentId}为占位符，我这边会将字符串替换为contentId
            }
    catalogue 是否显示目录，true为显示

See Configuration Reference.