suitForm 通用表单

背景

为了实现小程序表单

使用

<template>
	<suit-form labelPosition="left" :model="handleInfo" ref="form" labelWidth="105" :rules="rules">
        <suit-form-item label="情况说明" prop="content" :required="true" labelWidth="105" borderBottom labelPosition="top" :bodyStyle="{padding: '18px 0 4px'}">
            <suit-textarea :content.sync="handleInfo.content" isCount :height="100" :maxlength="200"
                placeholder="请输入情况说明" border="none" />
        </suit-form-item>
	</suit-form>
</template>
<script>
  export default{
    data(){

    },
    methods:{}
  }
</script>

参数说明

属性	描述	类型	可选值	默认值
model	表单组件的需要验证字段的集合	Object	——	uni.$u.props.form.model
rules	表单组件的需要的验证规则	Object, Function, Array	——	uni.$u.props.form.rules
errorType	错误提示方式	String	——	uni.$u.props.form.errorType
borderBottom	是否显示表单域的下划线边框	Boolean	——	uni.$u.props.form.borderBottom
labelPosition	label的位置，left-左边，top-上边	String	——	uni.$u.props.form.labelPosition
labelWidth	label的宽度，单位px	String, Number	——	uni.$u.props.form.labelWidth
labelAlign	lable字体的对齐方式	String	——	uni.$u.props.form.labelAlign
labelStyle	lable的样式，对象形式	Object	——	uni.$u.props.form.labelStyle

组件源码及综合示例参考

组件源码 (opens new window)组件参考 (opens new window)