<template>
    <div style="height: 300px" class="el-textarea el-textarea__inner" @click="$refs.vbEditIframe.focus()">
        <vb-edit-iframe :html="value" :limitFunc="limitFunc" ref="vbEditIframe" @change="onChange">
        </vb-edit-iframe>
    </div>
</template>
<script>
    // <vb-edit-text-area :fontSize="12" :limit="15" v-model="initHtml.textArea" ref="vbEditTextArea"></vb-edit-text-area>
    import vbEditIframe from "./vbEditIframe"
    export default {
        name: "vbEditTextArea",
        components:{vbEditIframe},
        props: {
            value: {
                type: String
            },
            limitFunc:{
                type:Function,
                default:null
            },
            change:{
                type:Function,
                default:null
            }
        },
        model: {
            prop: 'value',
            event: 'change'
        },
        data(){
            return {
            }
        },
        mounted(){
            this.$refs.vbEditIframe.setStyle({
            });
        },
        methods: {
            onChange() {
                // this.value = ;
                this.$emit('change', this.$refs.vbEditIframe.getHtml());
            },
            getHtml(){
                return this.$refs.vbEditIframe.getHtml();
            }
        }
    }
</script>
<style lang="less" scoped>
</style>
