我是靠谱客的博主 深情可乐,这篇文章主要介绍前端设置input输入框宽度固定,高度随输入内容变高,现在分享给大家,希望可以做个参考。

局限1:input只能控制输入内容为一行;textarea需要手动拖动改变大小。

实现:像 div, p这样的块元素默认是不可编辑的,但我们可以在标签内添加 contenteditable 属性设置为 true, 使其变为可编辑的。

contenteditable是一个全局属性,用于指示元素是否可被用户编辑,属性值可选true,false,空字符串。

  1. true 或者 ‘空字符串’, 表示该元素是可编辑的;
  2. false, 表示该元素是不可编辑的。
  3. 如果未设置此属性,则其默认值将从其父元素继承。

局限2:设置contenteditable之后不能使用v-model双向绑定。
解决:使用v-html和@blur解决

复制代码
1
2
3
4
5
<p contenteditable="true" v-html="name" @blur="name=$event.target.innerText"></p>

最后

以上就是深情可乐最近收集整理的关于前端设置input输入框宽度固定,高度随输入内容变高的全部内容,更多相关前端设置input输入框宽度固定内容请搜索靠谱客的其他文章。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(100)

评论列表共有 0 条评论

立即
投稿
返回
顶部