後台編輯器元件VmEditor

add image

<

template

>

<

divclass="wrap"

>

<

divclass="vm-editor"

>

<

divclass="wm-editor-menu"

>

<

divclass="vm-editor-button"

>

<

span

class="button"

>

<

imgsrc="../assets/images/img_icon.png"

@click="change" alt=""

srcset=""

>

span

>

<

divclass="vm-editor-dropdown"

v-show="showinput">

<

divclass="add-img"

>

add image

<

input

type="file"

accept="image/gif, image/jpeg, image/png"

ref="file"

@change="handlefilechange">

div>

div>

div>

div>

<

divclass="vm-editor-content"

contenteditable="true"

v-html="html" @input="ondivinput($event)" @focus="lock=true" @blur="lock=false">

div>

div>

div>

template

>

<

script

>

export

default

},watch: }},

mounted() ,

methods: ,

handlefilechange

:function(e)

varsize = math.floor(dom.size / 1024);

if (size > 10240) );

return

false

}var

_this = this;

varparams = new

formdata();

this.$postimg('/upload/image',params).then(res

=> else

}).catch(err

=> )

},change

:function() }}

script

>

<

style

scoped

>

.wrap

.vm-editor

.wrap

.vm-editor-content

.wrap

.wm-editor-menu

.wrap

.vm-editor-button

.vm-editor-button:first-child

.wrap

.vm-editor-button

span.button:hover

.wrap

.button

.wrap

.button

img.wrap

.vm-editor-dropdown

.wrap

.add-img

.wrap

.add-img

input

/*定義滾動條高寬及背景 高寬分別對應橫豎滾動條的尺寸*/

::-webkit-scrollbar

/*定義滾動條軌道 內陰影+圓角*/

::-webkit-scrollbar-track

/*定義滑塊 內陰影+圓角*/

::-webkit-scrollbar-thumb

style

>

修改ECSHOP後台編輯器的表情

ecshop後台的商品編輯和文章編輯使用的是fckedtor編輯器，此編輯器的工具條工具欄是可以自定義的，ecshop預設使用的是normal 屬於中檔功能，下面我們來改一下設定，讓fckedtor的全部功能都顯露出來。開啟 admin includes lib main.php。1 6 funct...

layUI富文字編輯器元件

1 元件自帶的上傳，自定義請求頭問題 layui版本2.x layui v2.5.5 mit license by 需要自己新增引數，否則自定義請求頭無效 2 富文字編輯器資料回顯 定義layedit為全域性變數，然後呼叫setcontent 設定編輯器內容 param index 編輯器索引 pa...

vim編輯器 編輯器之神

h 向左移動 j 向下移動 k 向上移動 l 向右移動 w 移動到下乙個單詞的首部 e 移動到下乙個單詞的尾部 b 移動到上乙個單詞的首部 移動到行首 移動到行尾 g 跳轉到文件的末尾 gg 跳轉到文件的開始複製操作 複製n行 nyy 2yy 移動游標到要寫入的位置，再按p 刪除操作 刪除多行 nd...