uniapp

sunui-textarea - 封装uniapp的textarea方便调用.

v1.0.0 于 2020.01.08更新

v1.0.1 于 2020.01.09更新：增加v-show，弹出的textarea层级较高会影响到遮罩层输入。点击查看本篇文章

 

示例代码：

<template>
	<view class="index-page">
		<!-- indent代表首行缩进，一般用2em即可 -->
		<!-- styTextarea设置textarea样式：font-size:0.8em;padding:2%;background-color:#F5F5F5; -->
		<!-- styMaxnum设置输入提示样式：text-align:right;color:#4888F2; -->
		<sunui-textarea ref="textarea" indent="0em" @input="getInput"></sunui-textarea>
	</view>
</template>

<script>
	import sunUiTextarea from "@/components/sunui-textarea/sunui-textarea.vue";
	export default {
		components: {
			'sunui-textarea': sunUiTextarea
		},
		data() {
			return {}
		},
		onShow() {

		},
		onLoad() {
			this.setRefsTextarea();
		},
		methods: {
			setRefsTextarea() {
				this.$nextTick(function() {
					// 是否显示输入输入样式提示,默认false
					this.$refs.textarea.maxnum = true;
					// 输入最大数量,传-1代表无限,默认为-1
					this.$refs.textarea.maxlength = 40;
					// 弹出键盘高度,默认40
					this.$refs.textarea.cursor = 40;
					// 是否禁用输入,默认不禁用
					this.$refs.textarea.disabled = false;
					// 是否显示组件,默认显示（控制它显示隐藏textarea）
					this.$refs.textarea.show = true;
					// 描述文字,默认简述文字...
					this.$refs.textarea.placeholder = "请输入你的备注...";
				});
			},
			getInput(e) {
				console.log(e);
			}
		}
	}
</script>

<style>

</style>

 

点击下载插件：sunui-textarea