e8df163268
Former-commit-id: 03d095d49bfee17f7ba355a6cdd5a59cbb95d80a [formerly 03d095d49bfee17f7ba355a6cdd5a59cbb95d80a [formerly 03d095d49bfee17f7ba355a6cdd5a59cbb95d80a [formerly 03d095d49bfee17f7ba355a6cdd5a59cbb95d80a [formerly ee00a9a643c513d59dff1cc739dc0a566bce63b4 [formerly 715c6c4ed9855dcc7ad775195f6686a427d085d3]]]]] Former-commit-id: e567a7e3db7019f2567f9fa769fea6639e75dd42 Former-commit-id: 6df46229a1ccd1e341501e9fee419999e9daeeca Former-commit-id: d3781c6cdf7e414047cafc9a7244a7abc6e7b778 [formerly a8d000bfdbfc4872d1383f17e8e8f6a4bdb239c3] Former-commit-id: 1f6bad0a0b3462e6a53692af6a153b0c7fbdd0ae Former-commit-id: e693037a587d7ddab5d87f311a4a0eda1a2c0c0b Former-commit-id: 8294c8385c4852f8cf0a2f21cf3ac655918845f1 Former-commit-id: 7ab11d42decf2d1bba7c26919ca86de20f664918 Former-commit-id: 4ef43b3c25ce828467141dafb206bf6bc9ade6d3
51 lines
1.3 KiB
Vue
51 lines
1.3 KiB
Vue
<template>
|
|
<d2-container>
|
|
<template slot="header">基本示例</template>
|
|
<d2-quill
|
|
style="min-height: 200px; margin-bottom: 20px;"
|
|
v-model="value"
|
|
@text-change="textChangeHandler"
|
|
@selection-change="selectionChangeHandler"
|
|
@editor-change="editorChangeHandler"/>
|
|
<el-button
|
|
type="primary"
|
|
@click="handleAddRow">
|
|
添加一行
|
|
</el-button>
|
|
<el-card shadow="never" class="d2-card d2-mt">
|
|
<d2-highlight :code="value" format-html/>
|
|
</el-card>
|
|
</d2-container>
|
|
</template>
|
|
|
|
<script>
|
|
import value from './value'
|
|
export default {
|
|
data () {
|
|
return {
|
|
value
|
|
}
|
|
},
|
|
methods: {
|
|
handleAddRow () {
|
|
this.value += '<p style="color: #409EFF;">我是新增的行</p>'
|
|
},
|
|
textChangeHandler (delta, oldDelta, source) {
|
|
// console.group('QuillEditor textChangeHandler')
|
|
// console.log(delta, oldDelta, source)
|
|
// console.groupEnd()
|
|
},
|
|
selectionChangeHandler (range, oldRange, source) {
|
|
// console.group('QuillEditor selectionChangeHandler')
|
|
// console.log(range, oldRange, source)
|
|
// console.groupEnd()
|
|
},
|
|
editorChangeHandler (eventName, ...args) {
|
|
// console.group('QuillEditor editorChangeHandler')
|
|
// console.log(eventName, args)
|
|
// console.groupEnd()
|
|
}
|
|
}
|
|
}
|
|
</script>
|