一、微信小程序textarea层级
在微信小程序中，textarea组件用于输入多行文本，它是其中一种视图层组件，属于基础组件之一，定义方式为``。textarea可以通过设置属性，获取和设置到当前textarea中的文本内容，以及输入框的大小，位置等信息。
二、微信小程序textarea失焦
textarea组件，在小程序开发中，我们一般会涉及到textarea的聚焦状态的控制，为了能够在用户输入完成后隐藏输入键盘，我们需要掌握textarea失焦后的行为表现。对于textarea组件而言，在失焦后并不会主动获取焦点或者触发任何行为，需要开发者自行处理相关代码来实现
三、微信小程序textarea的属性
textarea组件在使用时可以设置多种属性，这里主要介绍其中一些比较常用的属性：
class：自定义组件的样式类，可以在对应的css中设置样式
value：textarea 输入框中的文本内容
placeholder：输入框中的默认提示内容
cursor：设置输入框中的光标所在位置
auto-height：输入框高度会根据输入内容自动调整，只在 textarea 显示时生效，手动设置 height 属性时不生效
focus：设置输入框是否在对应时间内自动获取焦点，默认为 false
disabled：是否禁用textarea输入框，默认为false
placeholder-style：指定 placeholder 的样式
四、微信小程序textarea永远聚焦
在输入框中，如果我们想要永远获取焦点，在textarea组件中，可以设置focus为true，这样在渲染后，输入框会默认自动获取焦点。
五、微信小程序textarea光标如何移动
在web端使用上下左右箭头来实现输入框中的光标移动，但是在小程序中不支持这种方式，需要使用其他方式来实现。在微信小程序中，可以使用两种方式来实现输入框中光标的移动：1、使用组件自带的API：在input或者textarea组件上设置”cursorSpacing”和”selectionEnd”的值；2、使用小程序提供的辅助性库WxParse来实现，WxParse可以将html代码转化为小程序view可识别的代码。
六、微信小程序textarea回车键发送
在我们开发小程序时，常常需要输入完信息后使用左下角的回车键来触发相应的事件，如：发送信息操作。在微信小程序中，我们可以通过设置bindconfirm来实现，在用户点击完成时触发相应事件。
七、微信小程序textarea中文
在微信小程序中，textarea组件和input组件在处理中文输入上有一些区别。在input组件中，中文输入法在输入完成后会主动触发”input”事件，而在textarea组件中，中文输入法不会主动触发”input”事件，所以需要手动监听”confirm”事件或者其他事件来实现相应的逻辑处理。
八、微信小程序textarea的place不对齐
在小程序中，我们经常遇到输入框中的placeholder提示与输入框不在同一横坐标上的情况。这种情况常常通过在textarea标签中通过css样式来控制输入框和提示位置的方式进行解决。
textarea::-webkit-input-placeholder {
/* Chrome/Opera/Safari */
margin-left:10px;
}
textarea::-moz-placeholder {
/* Firefox 19+ */
margin-left:10px;
}
textarea:-ms-input-placeholder {
/* IE 10+ */
margin-left:10px;
}
九、微信小程序textarea cursor
在textarea中，当用户点击输入框后，光标会默认停留在最后一个字符处，在miniProgram中，当设置了cursor属性后，光标会默认出现在设置的位置处。通过js手动设置cursor的值，也可以实现移动光标的效果。
十、微信小程序textarea placeholder
在input中，placeholder属性可以在input框为空的时候显示默认的提示文本，而在textarea中并没有直接支持placeholder属性。我们可以通过在textarea父级元素上定义对应的样式、位置等来实现相应的效果。也可以通过设置placeholder的Value后，在代码逻辑处理时控制相应效果的实现。
原创文章，作者：PBBYA，如若转载，请注明出处：https://www.506064.com/n/331248.html
微信扫一扫 
支付宝扫一扫 