|
@@ -1,6 +1,6 @@
|
|
<template>
|
|
<template>
|
|
<div>
|
|
<div>
|
|
- <div class="address-placeholder" v-show="onshow">请输入</div>
|
|
|
|
|
|
+ <span class="address-placeholder" v-show="onshow">请输入</span>
|
|
<div
|
|
<div
|
|
class="test_box"
|
|
class="test_box"
|
|
contenteditable="true"
|
|
contenteditable="true"
|
|
@@ -15,6 +15,7 @@
|
|
</template>
|
|
</template>
|
|
|
|
|
|
<script>
|
|
<script>
|
|
|
|
+// import { Fragment } from 'vue-fragment'
|
|
export default {
|
|
export default {
|
|
name: 'DivEditable',
|
|
name: 'DivEditable',
|
|
props: ['value', 'Maincontent'],
|
|
props: ['value', 'Maincontent'],
|
|
@@ -23,9 +24,10 @@ export default {
|
|
innerText: this.value,
|
|
innerText: this.value,
|
|
isChange: true,
|
|
isChange: true,
|
|
composing: false,
|
|
composing: false,
|
|
- onshow:true
|
|
|
|
|
|
+ onshow: true
|
|
};
|
|
};
|
|
},
|
|
},
|
|
|
|
+ // components: { Fragment },
|
|
watch: {
|
|
watch: {
|
|
value() {
|
|
value() {
|
|
if (this.isChange) {
|
|
if (this.isChange) {
|
|
@@ -33,12 +35,15 @@ export default {
|
|
}
|
|
}
|
|
}
|
|
}
|
|
},
|
|
},
|
|
|
|
+ mounted() {
|
|
|
|
+ let len = this.validateTextLength(this.value);
|
|
|
|
+ this.onshow = len > 0 ? false : true;
|
|
|
|
+ },
|
|
methods: {
|
|
methods: {
|
|
handleInput(event) {
|
|
handleInput(event) {
|
|
let text = event.target.innerText;
|
|
let text = event.target.innerText;
|
|
- console.log(text)
|
|
|
|
this.valueHandle(event, text);
|
|
this.valueHandle(event, text);
|
|
- this.$emit('input', this.$el.innerHTML);
|
|
|
|
|
|
+ this.$emit('input', text);
|
|
},
|
|
},
|
|
//长度计算
|
|
//长度计算
|
|
validateTextLength(value) {
|
|
validateTextLength(value) {
|
|
@@ -60,7 +65,7 @@ export default {
|
|
return;
|
|
return;
|
|
}
|
|
}
|
|
let len = this.validateTextLength(text);
|
|
let len = this.validateTextLength(text);
|
|
- this.onshow = len>0?false:true
|
|
|
|
|
|
+ this.onshow = len > 0 ? false : true;
|
|
if (len > 200) {
|
|
if (len > 200) {
|
|
this.$refs[this.Maincontent].innerHTML = text.substr(0, 200);
|
|
this.$refs[this.Maincontent].innerHTML = text.substr(0, 200);
|
|
this.$refs[this.Maincontent].focus();
|
|
this.$refs[this.Maincontent].focus();
|