微信小程序表单（k-form）组件使用教程

小程序form表单提交模块

#script引用

import kForm from '../../components/k-form.vue'

#加载模块

components: {

        kForm
    },

#data设置内容

data() {
        return {

                form: {
                setUrl: "", //提交地址
                Btn: {
                    title: '',
                    kclass: ''
                }, //按钮
                item: [{
                        items: 'text', //类型
                        name: 'title2s', //提交的name值
                        title: '标题0',
                        tips: '提示22',
                    },
                    {
                        items: 'upimg', //类型
                        name: 'upimg', //提交的name值
                        title: '图片上传',
                        tips: '提示22',
                        default: ''
                    },
                    {
                        items: 'slider', //类型
                        name: 'titls', //提交的name值
                        title: '滑动选项',
                        tips: '提示22',
                        default: '10'
                    },
                    {
                        items: 'radio', //类型
                        name: 'dx', //提交的name值
                        title: '标题',
                        tips: '(提示)',
                        options: [{

                                title: '选项1',
                                name: 'xx1',
                                default: false
                            },
                            {

                                title: '选项2',
                                name: 'xx2',
                                default: false
                            }
                        ] //数据选项 array

                    }, //
                    {
                        items: 'checkbox', //类型
                        name: 'dxx', //提交的name值
                        title: '多项选择',
                        tips: '(提示)',
                        options: [{
                                title: '选项1',
                                name: 'dxx1',
                                default: false
                            },
                            {

                                title: '选项2',
                                name: 'dxx2',
                                default: false
                            }
                        ] //数据选项 array

                    }, //
                    {
                        items: 'text', //类型
                        name: 'title', //提交的name值
                        title: '标题',
                        tips: '提示',
                    }, //
                    {
                        items: 'switch', //类型
                        name: 'switch1', //提交的name值
                        title: '滑块',
                        tips: '提示22',
                        default: true //默认数据
                    },

                ] //('字段类型','name值', '标题', '提示', '数据项', '默认值' [, '属性', '额外属性', '额外css类'])




            }
        }
    },

#template显示模块

<k-form :form="form"></k-form>  

#模块说明文档

##text属性介绍

参数	含义	类型
items	单行输入框	string
name	提交的name值	string
title	标题	string
tips	提示内容	string
default	默认选项	string

##upimg属性介绍

参数	含义	类型
items	上传图片类	string
name	提交的name值	string
title	标题	string
tips	提示内容	string
num	最大上传图片数量	string
default	默认选项	array

{
    items: 'upimg', //类型
    name: 'upimg', //提交的name值
    title: '图片上传',
    tips: '提示22',
    num：1,
    default: ['url1','url2','url3']
},

….参考上方演示代码