console
var app = new Vue({
el: '#app',
data () {
return {
value: '',
}
},
methods: {
changeInput($event){
this.value = $event.target.value;
},
}
})
<div id="app">
<div class="textarea-wrapper">
<div class="content">{{value}}</div>
<textarea
v-model="value"
@input="changeInput($event)"
placeholder="请在此处输入文字..."
></textarea>
</div>
</div>
.textarea-wrapper{
position: relative;
min-height : 20px;
width: 100px;
}
.content{
display: block;
width: 100%;
font-size: 14px;
color: #333333;
line-height: 1.3;
word-wrap:break-word;
font-family: SourceHanSansCN-Regular;
padding: 0;
}
.textarea-wrapper textarea{
overflow:hidden;
resize:none;
width: 100%;
height: 100%;
font-family: SourceHanSansCN-Regular;
border: 0;
font-size: 14px;
color: #333333;
line-height: 1.3;
padding: 0px;
position: absolute;
left: 0;
top: 0;
}