1.0.2 • Published 2 years ago
vue-amis-editor v1.0.2
vue-amis-editor
Installation
yarn add vue-amis-editor --save
Quick Start
Serve.vue
import VueAmisEditor from 'vue-amis-editor'
export default Vue.extend({
name: 'ServeDev',
components: {
VueAmisEditor,
},
data() {
return {
preview: true,
schema: {
type: 'tasks',
name: 'tasks',
items: [
{
label: 'hive 任务',
key: 'hive',
status: 4,
remark: '查看详情<a target="_blank" href="http://www.baidu.com">日志</a>。',
},
{
label: '小流量',
key: 'partial',
status: 4,
},
{
label: '全量',
key: 'full',
status: 4,
},
],
id: 'u:5f649ab86d6a',
},
}
},
})
</script>
<template>
<div id="app">
<vue-amis-editor :is-preview="preview" :value="schema" />
</div>
</template>
props:
prop | type | default | explain | |
---|---|---|---|---|
isPreview | Boolean | false | Whether it is in preview | |
isMobile | Boolean | false | Is it mobile | isMobile |
navHeight | Number | 50 | Toolbar height | |
isTools | Boolean | true | Show and hide the toolbar | |
sources | Array | [] | video's source link | |
theme | Boolean | false | autoplay when video is loaded | |
loop | Boolean | false | amis theme | |
toolbar | Object | {title: 'vue-amis-editor',preview: 'preview',release: 'release',edit: 'edit',obtain: 'obtain',copy: "copy",clear: 'clear',set: "set"} | Toolbar configuration, support for internationalization | |
value | Object | {message: 'message'} | schemanode | |
onChange | Function | onChange(e) | amis onChange | |
obtain | Function | obtain | Get the data in the current amis-editor | |
copy | Function | copy | Copy the data of amis-editor | |
clear | Function | clear | data for clearamis-editor | |
getSchema | Function | getSchema | Get the data of amis-editor | |
setSchema | Function | setSchema(Schema) | set the data of amis-editor | |
togggeMobile | Function | togggeMobile(Boolean) | Switch between pc and mobile mode | |
togglePreview | Function | togglePreview(Boolean) ' | Preview and edit mode switching |