結論
Vue
props: {
text: String,
id: String,
},
data() {
return {
txt: this.text,
i: this.id,
}
},
computed:{
rows() {
if(this.txt === null) {
return 4
}
else{
let num = (this.txt.match(/\n/g) || []).length + 1
return (num > 4) ? num : 4
}
}
}
HTML
<textarea class="editable-contents-textarea" v-on:blur="saveText" v-model="txt" :id="'textarea'+ i" :rows="rows"></textarea>
css
.editable-contents-textarea{
height:auto;
}
補足
rows関数の４って言う数字は適当です．強いて言うなら最低の行数ですね
あと，if(this.txt === null)の分岐なんですけど，これはtexareaに文字がない場合のものです．
以上です
↧