更新记录

0.0.1(2025-03-26)

初始化发布,目前兼容H5、android-app、微信小程序


平台兼容性

Vue2 Vue3
×
App 快应用 微信小程序 支付宝小程序 百度小程序 字节小程序 QQ小程序
HBuilderX 4.11 app-vue × × × × ×
钉钉小程序 快手小程序 飞书小程序 京东小程序 鸿蒙元服务
× × × × ×
H5-Safari Android Browser 微信浏览器(Android) QQ浏览器(Android) Chrome IE Edge Firefox PC-Safari
× × ×

ng-form-uniui

简介

ng-form基于uniui的实现版本,目前兼容微信小程序、H5、android-app。已实现组件包含:

输入框
文本输入框
日期
日期时间
日期范围
数字输入框
单选框
多选框
下拉选择框
级联选择器
滑动选择器
评分
开关选择器
文件上传
图片上传

区划选择
webview内嵌

卡片布局
栅格布局
页签布局
折叠面板

使用说明

目前仅支持在uniapp端填报和展示,不支持表单配置,表单配置在pc端通过ng-form-element或者ng-form-elementplus进行。

代码使用说明:

<template>
    <view class="content">  
        <ng-form-uniui   ref="formBuild"  :models="formData"   :formTemplate="formTemplate" />
        <button   @click="formSubmit">提交</button> 
    </view>
</template>

<script> 

    // 实际使用中表单模板通过接口从后端获取
    import formJson from './form.json' 
    export default { 
        data() {
            return {
                formCode: '' , 
                id: '' ,
                formData: {

                } , // 表单数据 从后台获取
                formTemplate: formJson // 模板数据,从后台获取

            }
        },
        onLoad() { 
        }, 
        methods: {

            formSubmit() {
                const this_ = this 
                // 效验
                this.$refs.formBuild.validate().then(valid=> {
                    console.log('valid' , valid)
                    if(valid) {
                        const fdata = this_.$refs.formBuild.getData()

                        console.log('数据' , fdata) 
                    }
                })       
            }
        }
    }
</script> 

效果展示

基础表单 基础表单

隐私、权限声明

1. 本插件需要申请的系统权限列表:

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

暂无用户评论。

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问