@lambo-design-mobile/lambo-input-textarea

1.0.0-beta.5 • Public • Published

LamboInputTextarea 长文本输入框

介绍

LamboInputTextarea是一个基于vant拓展的长文本输入框的表单组件,支持表单状态下长文本输入框的使用。

引入

import Vue from 'vue';
import LamboInputTextarea from '@lambo-design-mobile/lambo-input-textarea';
 
Vue.use(LamboInputTextarea);

代码演示

基础用法

<van-cell-group>
    <input-textarea title="只读输入框" v-model="readOnlyText" :maxlength="10" :readonly="true" border/>
    <input-textarea title="必填输入框" v-model="mustText" :maxlength="10" must border @input="inputChange"/>
</van-cell-group>
import { Toast } from '@lambo-design-mobile/core'
import { CellGroup } from '@lambo-design-mobile/core'
export default {
    name: "index",
    components:{
        vanCellGroup:CellGroup
    },
    data(){
        return{
            readOnlyText:'只读',
            mustText:''
        }
    },
    methods:{
        inputChange(value){
            if(value){
                Toast({
                    message:value
                })
                console.log(value)
            }
        }
    }
}

API

Props

参数 说明 类型 默认值 版本
title 左侧标题 String '' -
type 输入框类型, 可选值为 tel digit number textarea password 等 String text -
placeholder 输入框占位提示文字 String '请输入' -
v-model (value) 当前输入的值 number/String - -
maxlength 输入的最大字符数 number/String 20 -
must 是否必填 Boolean false -
readonly 是否只读 Boolean false -
border 是否展示内边框 Boolean true -
useClass 是否启用input-style Boolean false -
autosize 是否自适应内容高度,可传入对象,如 { maxHeight: 100, minHeight: 50 },单位为px Boolean/Object false -

Events

事件名 说明 回调参数
input 输入框内容变化时触发 value: string (当前输入的值)

Readme

Keywords

none

Package Sidebar

Install

npm i @lambo-design-mobile/lambo-input-textarea

Weekly Downloads

7

Version

1.0.0-beta.5

License

ISC

Unpacked Size

10.1 kB

Total Files

7

Last publish

Collaborators

  • lamboegg