jobsys-newbie
Version:
Enhanced component based on ant-design-vue
19 lines (15 loc) • 9.14 kB
JavaScript
import{N as u}from"./NewbieEditor-c8effb0f.js";import{_ as r,r as d,e as k,o as h,c as m,b as n,f as t,d as a,w as v,u as l,a as p}from"./app-e5356031.js";import{B as b}from"./index-2bac9f50.js";import{m as g}from"./index-b4cb0b96.js";import"./NewbieProvider-45d73778.js";import"./index-16cac109.js";import"./compact-item-45f3d050.js";import"./CloseCircleFilled-7d1a9da0.js";import"./ExclamationCircleFilled-71949edd.js";import"./FormItemContext-af84826a.js";import"./useFlexGapSupport-e1acb751.js";import"./styleChecker-8bbc1161.js";import"./network-3dbc60ad.js";import"./isString-dfb8fe43.js";import"./isUndefined-aa0326a0.js";const _=n("h1",{id:"newbieeditor",tabindex:"-1"},[n("a",{class:"header-anchor",href:"#newbieeditor","aria-hidden":"true"},"#"),t(" NewbieEditor")],-1),f=n("blockquote",null,[n("p",null,"富文本编辑器 基于 WangEditor")],-1),w=n("p",null,"Version: 1.0.0",-1),q={href:"https://www.wangeditor.com/v5/for-frame.html#vue3",target:"_blank",rel:"noopener noreferrer"},y=n("h2",{id:"props",tabindex:"-1"},[n("a",{class:"header-anchor",href:"#props","aria-hidden":"true"},"#"),t(" Props")],-1),x=n("thead",null,[n("tr",null,[n("th",null,"Prop name"),n("th",null,"Description"),n("th",null,"Type"),n("th",null,"Values"),n("th",null,"Default")])],-1),E=n("tr",null,[n("td",null,"v-model"),n("td",null,[t("输入框的值"),n("br"),n("code",null,"@model"),t(" true")]),n("td",null,"string"),n("td",null,"-"),n("td",null,'""')],-1),N=n("tr",null,[n("td",null,"placeholder"),n("td",null,"占位符"),n("td",null,"string"),n("td",null,"-"),n("td",null,'"请输入内容..."')],-1),C=n("tr",null,[n("td",null,"disabled"),n("td",null,"是否禁用"),n("td",null,"boolean"),n("td",null,"-"),n("td",null,"false")],-1),B=n("tr",null,[n("td",null,"readonly"),n("td",null,"是否只读"),n("td",null,"boolean"),n("td",null,"-"),n("td",null,"false")],-1),V=n("td",null,"config",-1),P=n("br",null,null,-1),j=n("code",null,"@params",-1),D={href:"https://www.wangeditor.com/v5/toolbar-config.html",target:"_blank",rel:"noopener noreferrer"},U=n("br",null,null,-1),I=n("code",null,"@params",-1),L={href:"https://www.wangeditor.com/v5/editor-config.html",target:"_blank",rel:"noopener noreferrer"},S=n("td",null,"object",-1),T=n("td",null,"-",-1),W=n("td",null,[t("{"),n("br"),t(" toolbarConfig: {},"),n("br"),t(" editorConfig: {}"),n("br"),t("}")],-1),z=p(`<h2 id="events" tabindex="-1"><a class="header-anchor" href="#events" aria-hidden="true">#</a> Events</h2><table><thead><tr><th>Event name</th><th>Properties</th><th>Description</th></tr></thead><tbody><tr><td>update:value</td><td></td><td></td></tr></tbody></table><hr><h2 id="方法" tabindex="-1"><a class="header-anchor" href="#方法" aria-hidden="true">#</a> 方法</h2><table><thead><tr><th>名称</th><th>参数</th><th>说明</th></tr></thead><tbody><tr><td>setContent</td><td>(content:string) => void</td><td>设置编辑器内容</td></tr></tbody></table><h2 id="provider" tabindex="-1"><a class="header-anchor" href="#provider" aria-hidden="true">#</a> Provider</h2><table><thead><tr><th>名称</th><th>参数</th><th>说明</th></tr></thead><tbody><tr><td>uploadUrl</td><td>string</td><td>编辑器中的图片,文件上传路径</td></tr></tbody></table><div class="language-html line-numbers-mode" data-ext="html"><pre class="language-html"><code><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>NewbieProvider</span> <span class="token attr-name">:eidtor</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>{uploadeUrl: 'somewhere-that-can-upload-files'}<span class="token punctuation">"</span></span> <span class="token punctuation">/></span></span>
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div></div></div><h2 id="示例" tabindex="-1"><a class="header-anchor" href="#示例" aria-hidden="true">#</a> 示例</h2><hr>`,10),A=n("hr",null,null,-1),F=p(`<div class="language-vue line-numbers-mode" data-ext="vue"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>template</span><span class="token punctuation">></span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>Button</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>primary<span class="token punctuation">"</span></span> <span class="token attr-name">@click</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>getContent<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>获取内容<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>Button</span><span class="token punctuation">></span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>NewbieEditor</span> <span class="token attr-name"><span class="token namespace">v-model:</span>value</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>content<span class="token punctuation">"</span></span> <span class="token attr-name">placeholder</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>来吧,写吧<span class="token punctuation">"</span></span> <span class="token punctuation">/></span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>template</span><span class="token punctuation">></span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>script</span> <span class="token attr-name">setup</span><span class="token punctuation">></span></span><span class="token script"><span class="token language-javascript">
<span class="token keyword">import</span> <span class="token punctuation">{</span> NewbieEditor <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">"jobsys-newbie"</span>
<span class="token keyword">import</span> <span class="token punctuation">{</span> message<span class="token punctuation">,</span> Button <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">"ant-design-vue"</span>
<span class="token keyword">import</span> <span class="token punctuation">{</span> ref <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">"vue"</span>
<span class="token keyword">const</span> content <span class="token operator">=</span> <span class="token function">ref</span><span class="token punctuation">(</span><span class="token string">""</span><span class="token punctuation">)</span>
<span class="token keyword">const</span> <span class="token function-variable function">getContent</span> <span class="token operator">=</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span>
message<span class="token punctuation">.</span><span class="token function">success</span><span class="token punctuation">(</span>content<span class="token punctuation">.</span>value<span class="token punctuation">)</span>
<span class="token punctuation">}</span>
</span></span><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>script</span><span class="token punctuation">></span></span>
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div>`,1),G={__name:"NewbieEditor.html",setup(H){const s=d(""),c=()=>{g.success(s.value)};return(J,o)=>{const e=k("ExternalLinkIcon");return h(),m("div",null,[_,f,w,n("p",null,[n("a",q,[t("See"),a(e)])]),y,n("table",null,[x,n("tbody",null,[E,N,C,B,n("tr",null,[V,n("td",null,[P,j,t(" .toolbarConfig "),n("a",D,[t("工具栏配置"),a(e)]),U,I,t(" .editorConfig "),n("a",L,[t("编辑器配置"),a(e)])]),S,T,W])])]),z,a(l(b),{type:"primary",onClick:c},{default:v(()=>[t("获取内容")]),_:1}),A,a(l(u),{value:s.value,"onUpdate:value":o[0]||(o[0]=i=>s.value=i),placeholder:"来吧,写吧"},null,8,["value"]),F])}}},ln=r(G,[["__file","NewbieEditor.html.vue"]]);export{ln as default};